发表于: 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
  
ng-model
      ng-model指令用来将input、select、textare或自定义表单控件同包含他们的作用域中的属性进行绑定。他苦役提供并处理表单验证公呢个,在元素上设置相关的css类。
 





返回列表 返回列表
评论

    分享到