CN106776800A - AngularJS框架的页面生成方法、装置及系统 - Google Patents
AngularJS框架的页面生成方法、装置及系统 Download PDFInfo
- Publication number
- CN106776800A CN106776800A CN201611049297.6A CN201611049297A CN106776800A CN 106776800 A CN106776800 A CN 106776800A CN 201611049297 A CN201611049297 A CN 201611049297A CN 106776800 A CN106776800 A CN 106776800A
- Authority
- CN
- China
- Prior art keywords
- angularjs
- template file
- html
- data object
- vtemplet
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Granted
Links
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/958—Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- General Engineering & Computer Science (AREA)
- Software Systems (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Databases & Information Systems (AREA)
- Data Mining & Analysis (AREA)
- Information Transfer Between Computers (AREA)
- Document Processing Apparatus (AREA)
Abstract
本发明公开了一种基于AngularJS框架的页面生成方法,包括:将vtemplet定制的模板文件按照预定解析格式进行解析,生成数据对象;按照所述数据对象的数据格式及AngularJS语法规则,将所述数据对象转换为符合AngularJS语法的html语言,将所述html语言写入文件系统中生成html静态页面;可见,在方案中,通过将vtemplet定制的模板文件转换为符合AngularJS语法的html静态页面,实现了前台系统对html静态页面的展示;本发明还公开了一种基于AngularJS框架的页面生成装置及系统,同样具有上述技术效果。
Description
技术领域
本发明涉及页面生成技术领域,更具体地说,涉及一种基于AngularJS框架的页面生成方法、装置及系统。
背景技术
目前,金交所新一代综合交易系统的门户网站采用互联网当下比较流行也是比较新的框架和技术,其中AngularJS框架作为一款优秀的前端静态页面实现技术是系统的一大亮点。为了业务需求,实现金交所理财产品的定制功能,使用vtemplet构件进行页面的定制生成,vtemplet为基于vtemplate技术实现的一种可视化图形界面个性化定制jsp页面的构件,以标签的方式实现jsp的动态加载。但是目前vtemplet只能支持金交所后台管理系统中的产品定制功能,不能对html静态页面提供支持,即vtemplet定制并生成的jsp页面的功能并不能用于前台系统中。
因此,如何使前台系统展示vtemplet定制的页面,是本领域技术人员需要解决的问题。
发明内容
本发明的目的在于提供一种基于AngularJS框架的页面生成方法、装置及系统,以实现生成基于AngularJS语法的html静态页面,使前台系统进行展示。
为实现上述目的,本发明实施例提供了如下技术方案:
一种基于AngularJS框架的页面生成方法,包括:
将vtemplet定制的模板文件按照预定解析格式进行解析,生成数据对象;
按照所述数据对象的数据格式及AngularJS语法规则,将所述数据对象转换为符合AngularJS语法的html语言,将所述html语言写入文件系统中生成html静态页面。
其中,所述将vtemplet定制的模板文件按照预定解析格式进行解析,生成数据对象,包括:
将vtemplet定制的所述模板文件加载至内存;
按照预定解析格式解析所述模板文件的内容,生成数据对象。
其中,所述模板文件为vtemplet定制的xml格式的模板文件。
其中,将所述html语言写入文件系统中生成html静态页面之后,还包括:
将所述html静态页面通过浏览器展示。
一种基于AngularJS框架的页面生成装置,包括:
解析模块,用于将vtemplet定制的模板文件按照预定解析格式进行解析,生成数据对象;
遍历模块,用于按照所述数据对象的数据格式及AngularJS语法规则,将所述数据对象转换为符合AngularJS语法的html语言,将所述html语言写入文件系统中生成html静态页面。
其中,所述解析模块将vtemplet定制的所述模板文件加载至内存,按照预定解析格式解析所述模板文件的内容,生成数据对象。
其中,所述模板文件为vtemplet定制的xml格式的模板文件。
一种基于AngularJS框架的页面生成系统,包括上述页面生成装置,以及展示所述html静态页面的浏览器。
通过以上方案可知,本发明实施例提供的一种基于AngularJS框架的页面生成方法,包括:将vtemplet定制的模板文件按照预定解析格式进行解析,生成数据对象;按照所述数据对象的数据格式及AngularJS语法规则,将所述数据对象转换为符合AngularJS语法的html语言,将所述html语言写入文件系统中生成html静态页面;可见,在方案中,通过将vtemplet定制的模板文件转换为符合AngularJS语法的html静态页面,实现了前台系统对html静态页面的展示;本发明还公开了一种基于AngularJS框架的页面生成装置及系统,同样具有上述技术效果。
附图说明
为了更清楚地说明本发明实施例或现有技术中的技术方案,下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本发明的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他的附图。
图1为本发明实施例公开的一种基于AngularJS框架的页面生成方法流程示意图;
图2为本发明实施例公开的一种基于AngularJS框架的页面生成装置结构示意图。
具体实施方式
下面将结合本发明实施例中的附图,对本发明实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本发明一部分实施例,而不是全部的实施例。基于本发明中的实施例,本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例,都属于本发明保护的范围。
本发明实施例公开了一种基于AngularJS框架的页面生成方法、装置及系统,以实现生成基于AngularJS语法的html静态页面,使前台系统进行展示。
需要说明的是,Vtemplet为基于vtemplate技术实现的一种可视化图形界面个性化定制jsp页面的构件,以标签的方式实现jsp的动态加载;AngularJS是一款优秀的前端JS框架,已经被用于Google的多款产品当中。
参见图1,本发明实施例提供的一种基于AngularJS框架的页面生成方法,包括:
S101、将vtemplet定制的模板文件按照预定解析格式进行解析,生成数据对象;
其中,所述将vtemplet定制的模板文件按照预定解析格式进行解析,生成数据对象,包括:
将vtemplet定制的所述模板文件加载至内存;按照预定解析格式解析所述模板文件的内容,生成数据对象;其中,所述模板文件为vtemplet定制的xml格式的模板文件。
具体的,本实施例中的模板文件可以为通过Vtemplet可视化模板设计器所制定的,具体的模板文件生成方法为:通过设计器的布局栏设计页面的基础布局,并添加设计器的数据项,生成页面模板,这样保存后即生成一个格式为xml的模板文件;其中,数据项是基于一个bom.xml文件生成的,bom.xml文件定义了一组相关数据的集合。
需要说明的是,在vtemplet标签被解析时,会通过应用服务器将此模板文件加载至内存中,并通过固定的解析格式将模板文件的内容解析为数据对象,并通过对这个数据对象的遍历,生成与此模板文件对应的html文件。
S102、按照所述数据对象的数据格式及AngularJS语法规则,将所述数据对象转换为符合AngularJS语法的html语言,将所述html语言写入文件系统中生成html静态页面。
其中,将所述html语言写入文件系统中生成html静态页面之后,还包括:将所述html静态页面通过浏览器展示。
具体的,在本方案对数据对象进行遍历时,根据数据对象的数据格式及AngularJS语法规则,通过java语言将数据对象转换成符合AngularJS语法的html语言写入到html格式的文件系统中,生成html格式的静态页面,并可以直接由浏览器打开。
下面对本发明实施例提供的页面生成装置进行介绍,下文描述的页面生成装置与上文描述的页面生成系统可以相互参照。
参见图2,本发明实施例提供的一种基于AngularJS框架的页面生成装置,包括:
解析模块100,用于将vtemplet定制的模板文件按照预定解析格式进行解析,生成数据对象;
具体的,解析模块100在对vtemplet标签解析时,会通过应用服务器将此模板文件加载至内存中,并通过固定的解析格式将模板文件的内容解析为数据对象,并通过对这个数据对象的遍历,生成与此模板文件对应的html文件。
遍历模块200,用于按照所述数据对象的数据格式及AngularJS语法规则,将所述数据对象转换为符合AngularJS语法的html语言,将所述html语言写入文件系统中生成html静态页面。
其中,所述解析模块将vtemplet定制的所述模板文件加载至内存,按照预定解析格式解析所述模板文件的内容,生成数据对象;所述模板文件为vtemplet定制的xml格式的模板文件。
具体的,在本方案中的遍历模块200对数据对象进行遍历时,根据数据对象的数据格式及AngularJS语法规则,通过java语言将数据对象转换成符合AngularJS语法的html语言写入到html格式的文件系统中,生成html格式的静态页面,并可以直接由浏览器打开。
本发明实施例提供一种基于AngularJS框架的页面生成系统,包括上述的页面生成装置,以及展示所述html静态页面的浏览器。
本发明实施例提供的一种基于AngularJS框架的页面生成方法,包括:将vtemplet定制的模板文件按照预定解析格式进行解析,生成数据对象;按照所述数据对象的数据格式及AngularJS语法规则,将所述数据对象转换为符合AngularJS语法的html语言,将所述html语言写入文件系统中生成html静态页面;可见,在方案中,通过将vtemplet定制的模板文件转换为符合AngularJS语法的html静态页面,实现了前台系统对html静态页面的展示;本发明还公开了一种基于AngularJS框架的页面生成装置及系统,同样具有上述技术效果。本说明书中各个实施例采用递进的方式描述,每个实施例重点说明的都是与其他实施例的不同之处,各个实施例之间相同相似部分互相参见即可。
对所公开的实施例的上述说明,使本领域专业技术人员能够实现或使用本发明。对这些实施例的多种修改对本领域的专业技术人员来说将是显而易见的,本文中所定义的一般原理可以在不脱离本发明的精神或范围的情况下,在其它实施例中实现。因此,本发明将不会被限制于本文所示的这些实施例,而是要符合与本文所公开的原理和新颖特点相一致的最宽的范围。
Claims (8)
1.一种基于AngularJS框架的页面生成方法,其特征在于,包括:
将vtemplet定制的模板文件按照预定解析格式进行解析,生成数据对象;
按照所述数据对象的数据格式及AngularJS语法规则,将所述数据对象转换为符合AngularJS语法的html语言,将所述html语言写入文件系统中生成html静态页面。
2.根据权利要求1所述的页面生成方法,其特征在于,所述将vtemplet定制的模板文件按照预定解析格式进行解析,生成数据对象,包括:
将vtemplet定制的所述模板文件加载至内存;
按照预定解析格式解析所述模板文件的内容,生成数据对象。
3.根据权利要求1或2所述的页面生成方法,其特征在于,所述模板文件为vtemplet定制的xml格式的模板文件。
4.根据权利要求3所述的页面生成方法,其特征在于,将所述html语言写入文件系统中生成html静态页面之后,还包括:
将所述html静态页面通过浏览器展示。
5.一种基于AngularJS框架的页面生成装置,其特征在于,包括:
解析模块,用于将vtemplet定制的模板文件按照预定解析格式进行解析,生成数据对象;
遍历模块,用于按照所述数据对象的数据格式及AngularJS语法规则,将所述数据对象转换为符合AngularJS语法的html语言,将所述html语言写入文件系统中生成html静态页面。
6.根据权利要求5所述的页面生成装置,其特征在于,
所述解析模块将vtemplet定制的所述模板文件加载至内存,按照预定解析格式解析所述模板文件的内容,生成数据对象。
7.根据权利要求5或6所述的页面生成装置,其特征在于,所述模板文件为vtemplet定制的xml格式的模板文件。
8.一种基于AngularJS框架的页面生成系统,其特征在于,包括如权利要求5-7中任意一项所述的页面生成装置,以及展示所述html静态页面的浏览器。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201611049297.6A CN106776800B (zh) | 2016-11-22 | 2016-11-22 | AngularJS框架的页面生成方法、装置及系统 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201611049297.6A CN106776800B (zh) | 2016-11-22 | 2016-11-22 | AngularJS框架的页面生成方法、装置及系统 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN106776800A true CN106776800A (zh) | 2017-05-31 |
CN106776800B CN106776800B (zh) | 2020-09-11 |
Family
ID=58910556
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201611049297.6A Active CN106776800B (zh) | 2016-11-22 | 2016-11-22 | AngularJS框架的页面生成方法、装置及系统 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN106776800B (zh) |
Cited By (5)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN107506186A (zh) * | 2017-08-08 | 2017-12-22 | 山东中创软件工程股份有限公司 | 一种定制页面生成的方法和系统 |
CN109426497A (zh) * | 2017-08-18 | 2019-03-05 | 北京国双科技有限公司 | 数据嵌入方法、装置、系统以及存储介质 |
CN109753273A (zh) * | 2017-11-06 | 2019-05-14 | 芜湖美的厨卫电器制造有限公司 | 基于mvvm框架的物联网应用开发方法、装置及其设备 |
CN110442816A (zh) * | 2019-07-12 | 2019-11-12 | 平安科技(深圳)有限公司 | 网页表单配置方法、装置及计算机可读存储介质 |
CN111131660A (zh) * | 2019-12-24 | 2020-05-08 | 贝壳技术有限公司 | 一种图像数据处理方法、装置、电子设备及其存储介质 |
Citations (3)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN105094836A (zh) * | 2015-08-11 | 2015-11-25 | 北京京东尚科信息技术有限公司 | 一种生成说明文档的方法和装置 |
US20160179897A1 (en) * | 2014-12-18 | 2016-06-23 | Salesforce.Com, Inc. | Data extraction using object relationship templates |
CN105760440A (zh) * | 2016-02-02 | 2016-07-13 | 广州市科南软件有限公司 | 在线表单设计器的实现方法及其系统 |
-
2016
- 2016-11-22 CN CN201611049297.6A patent/CN106776800B/zh active Active
Patent Citations (3)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US20160179897A1 (en) * | 2014-12-18 | 2016-06-23 | Salesforce.Com, Inc. | Data extraction using object relationship templates |
CN105094836A (zh) * | 2015-08-11 | 2015-11-25 | 北京京东尚科信息技术有限公司 | 一种生成说明文档的方法和装置 |
CN105760440A (zh) * | 2016-02-02 | 2016-07-13 | 广州市科南软件有限公司 | 在线表单设计器的实现方法及其系统 |
Non-Patent Citations (1)
Title |
---|
王刚等: "面向业务的敏捷界面定制构件的设计", 《微型机与应用》 * |
Cited By (6)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN107506186A (zh) * | 2017-08-08 | 2017-12-22 | 山东中创软件工程股份有限公司 | 一种定制页面生成的方法和系统 |
CN109426497A (zh) * | 2017-08-18 | 2019-03-05 | 北京国双科技有限公司 | 数据嵌入方法、装置、系统以及存储介质 |
CN109753273A (zh) * | 2017-11-06 | 2019-05-14 | 芜湖美的厨卫电器制造有限公司 | 基于mvvm框架的物联网应用开发方法、装置及其设备 |
CN110442816A (zh) * | 2019-07-12 | 2019-11-12 | 平安科技(深圳)有限公司 | 网页表单配置方法、装置及计算机可读存储介质 |
CN110442816B (zh) * | 2019-07-12 | 2024-01-30 | 平安科技(深圳)有限公司 | 网页表单配置方法、装置及计算机可读存储介质 |
CN111131660A (zh) * | 2019-12-24 | 2020-05-08 | 贝壳技术有限公司 | 一种图像数据处理方法、装置、电子设备及其存储介质 |
Also Published As
Publication number | Publication date |
---|---|
CN106776800B (zh) | 2020-09-11 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN106776800A (zh) | AngularJS框架的页面生成方法、装置及系统 | |
US10318614B2 (en) | Transformation of marked-up content into a file format that enables automated browser based pagination | |
Frain | Responsive web design with HTML5 and CSS3 | |
CN102043626B (zh) | extjs组件的封装方法及装置、用户界面的生成方法及系统 | |
CN108268262A (zh) | 实现将html转换为微信小程序的方法、装置及系统 | |
CN103970750B (zh) | 一种生成html网页的方法和装置 | |
CA2755427A1 (en) | Web translation with display replacement | |
CN106886551A (zh) | 一种利用标记语言显示图像的方法及装置 | |
Sikos | Web standards: mastering HTML5, CSS3, and XML | |
CN103544024A (zh) | 生成浏览器页面的方法、系统及终端设备 | |
Sikos | Web Standards: Mastering HTML5, CSS3, and XML | |
Dominici | An overview of Pandoc | |
CN108228181A (zh) | 在html页面中嵌入html页面的方法及装置 | |
US20170031889A1 (en) | Creating a communication editable in a browser independent of platform and operating system | |
JP2008536214A (ja) | コンピュータ画面上にデータ表示ウィンドウと入力ウィンドウを動的に視覚表示する方法 | |
US20150007021A1 (en) | Vector Graphic Conversion into Fonts | |
US8862976B1 (en) | Methods and systems for diagnosing document formatting errors | |
Artail et al. | Device-aware desktop web page transformation for rendering on handhelds | |
CN103226475B (zh) | 转码时实现控件替换的方法及装置 | |
CN108334343A (zh) | 基于视觉、组件、图标的前端开发系统 | |
Loudon | Developing Large Web Applications: Producing Code That Can Grow and Thrive | |
López-Gorozabel et al. | Bootstrap as a tool for web development and graphic optimization on mobile devices | |
CN114356291A (zh) | 基于配置文件生成表单的方法、装置、设备及介质 | |
Barker et al. | Pro data visualization using R and JavaScript | |
CN116009863B (zh) | 前端页面渲染方法、设备及存储介质 |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
PB01 | Publication | ||
PB01 | Publication | ||
SE01 | Entry into force of request for substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
GR01 | Patent grant | ||
GR01 | Patent grant |