发表于: 2017-01-21 01:39:30
0 1383
今天完成的事情:看了关于自定义指令,用列表循环的方式写option
明天计划的事情:根据ui图写小程序,看angular
收获:(通过今天的学习,学到了什么知识)
根据选择的值不同,显示不同的内容
<select ng-model ='myVar'>
<option value="runoob">www.runoob.com</option>
<option value="google">www.google.com</option>
<option value="taobao">www.taobao.com</option>
</select>
<div ng-switch ="myVar">
<div ng-switch-when="runoob">
<h1>菜鸟教程</h1>
<p>欢迎访问菜鸟教程</p>
</div>
<div ng-switch-when="google">
<h1>google</h1>
<p>欢迎访问google</p>
</div>
<div ng-switch-when="taobao">
<h1>淘宝</h1>
<p>欢迎访问淘宝</p>
</div>
<div ng-switch-default>
<h1>切换</h1>
<p>选择不同选项显示对应的值</p>
</div>
</div>
在select中用ng-model绑定选项的value
ng-switch的value与select的ng-model值绑定。当ng-switch-when的值改变显示不同的内容
ng-if
使用ng-if指令可以完全根据表达式的值在dom中生成或移除一个元素。
如果值是true,那对应的元素将会从dom中移除,否则对应元素的一个克隆将被重新插入dom中
ng-if同ng-show和ng-hide指令最本质的区别是,它不是通过css显示或隐藏dom节点,而是真正生成或移除节点。
当一个元素被ng-if从dom中移除,同它关联的作用域也会被销毁。而且当它重新加入dom中时,会通过原型继承从它的父作用域生成一个新的作用域
ng-repeat
.png)
ng-model
ng-model指令用来将input、select、textare或自定义表单控件同包含他们的作用域中的属性进行绑定。他苦役提供并处理表单验证公呢个,在元素上设置相关的css类。
评论