码迷,mamicode.com
首页 > Web开发 > 详细

angularjs学习笔记--

时间:2017-08-20 00:40:29      阅读:164      评论:0      收藏:0      [点我收藏+]

标签:innerhtml   mode   等价   html元素   angular   inner   app   初始化   隐藏和显示   

<span ng-bind="name"></span>
<span ng:bind="name"></span>
<span ng_bind="name"></span>
<span data-ng-bind="name"></span>
<span x-ng-bind="name"></span>

 

Ps:上述绑定方法等价

 

ng-app=”模块名”  定义angularjs的使用范围;

ng-init=”变量=值”,初始化变量的值,当有多个变量时,中间用分号隔开;

ng-model=”变量”  定义变量名;

ng-bind=”变量”  绑定变量名,获取该变量的数据。这里的变量即是前一条的变量名。但一般用双重花括号来获取变量的值。

 

 

<div ng-app=""> 
    <p>名字:<input type="text" ng-model="name" /></p> 
    <h1>hello{{name}}</h1> 
</div>

ng-app指令告诉angularjs,<div>元素是angularjs应用程序的所有者;ng-model指令把输入域的值绑定到应用程序变量name;ng-bind指令把应用程序变量name绑定到某个段落的innerHTML。

 

Angularjs对于开发单一页面应用程序变得更易:angularjs把应用程序数据绑定到HTML元素;可以克隆和充分HTML代码;可以隐藏和显示HTML元素;可以在HTML元素背后添加代码;支持输入验证。

 

<div ng-app="" ng-init="firstName=‘jonh‘"> 
<p>姓名为:<span ng-bind="firstName"></span></p>     
</div>

 

H5允许扩展的属性,以data-开头,angularjs属性以ng-开头,但可以使用data-ng-让网页对h5有效。

<div ng-app="" data-ng-init="firstName=‘jonh‘"> 
<p>姓名为:<span data-ng-bind="firstName"></span></p>     
</div>

 

Angularjs表达式:

Angularjs表达式写在双大括号内;angularjs表达式把数据绑定到HTML,类似于ng-bind指令;angularjs将在表达式书写的位置输出数据。

 

 

Angularjs模块定义了angularjs的应用;angularjs控制器用于控制angularjs应用;ng-app指令了应用,与ng-controller定义了控制器。

 

 

未完待续。。。。。。

 

参考 & 感谢:http://www.runoob.com/angularjs/angularjs-intro.html

 

angularjs学习笔记--

标签:innerhtml   mode   等价   html元素   angular   inner   app   初始化   隐藏和显示   

原文地址:http://www.cnblogs.com/haimengqingyuan/p/7398250.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!