你好世界详细解释的AngularJS入门例子

你好世界详细解释的AngularJS入门例子
本文的例子讲述了AngularJS的介绍,例如世界你好。分享给您参考,如下:

以前的项目都使用jQuery和原始的Javascript,并在项目近期参与需要一个比较潮如AngularJS和requirejs框架。在这里记录学习过程,虽然事实上原来的名字,是参考了一些互联网上的信息,加上自己的一些实践和认识。在熟悉的AngularJS,没有高质量的文章,只有学习笔记和备忘录。这个练习的版本是1.2.25。

示例代码如下所示:

你好,世界!

你好,{ {姓名} }

浏览器打开网页,在文本框中输入发现界面将自动实时显示。如果你使用Javascript和jQuery来完成这样一个小小的功能,我们将登记的监控事件,得到文本的控件的值,然后将值显示。和AngularJS,我们需要做的是添加NG APP,添加ng模型,并使用{ {姓名} }来显示它。很显然,AngularJS使用更简单、更紧凑。现在让我们简单地看看这3件事的意义。

1、天然气应用程序:它可以放置在任何DOM节点,代表节点及其所有子节点内AngularJS管理范围。如果我们把这个标签,我们将看到AngularJS框架不会工作

你好,世界!
你好,{ {姓名} }

你好,{ {姓名} }

这一次我们把NG的应用程序,你可以看到里面的数据的DIV,可以实时显示输入,和外界没有影响。可以看出,一个HTML页面都可以交给AngularJS管理,或只AngularJS可以管理页面的一部分。我们可以添加需要应用程序的DOM节点。

2、NG模型:这是AngularJS数据双向绑定特性。简单点理解:告诉AngularJS这是一个数据模型,你拯救了我的记忆。在界面中修改数据,并在存储器中的数据将自动修改;内存中的变量的值被修改,和界面显示将自动改变。这个功能是很方便的保持数据的一致性和避免自己的代码来完成这个功能。

3、{ {姓名} }:这是框架所提供的表达式的语法,它可以显示内存中的数据模型的价值。这是类似于struts2,这是用来显示数据的。这只是语法格式由AngularJS的定义,类似于JSP页面的EL表达式,struts2 OGNL,这是一个数据采集机制。

更多的读者在AngularJS相关内容感兴趣的可以看看网站:AngularJS入门和进阶教程和AngularJS MVC架构概述

希望这篇文章能帮助的AngularJS程序设计。
免责声明:本网信息来自于互联网,目的在于传递更多信息,并不代表本网赞同其观点。其原创性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺,并请自行核实相关内容。本站不承担此类作品侵权行为的直接责任及连带责任。如若本网有任何内容侵犯您的权益,请及时联系我们,本站将会在24小时内处理完毕。
相关文章
返回顶部