• angular中的ng-if和ng-show的区别以及ng-if的作用域问题


      项目有个需求是区分用户的身份,需要设置显示两个浮动框,根据不同的身份显示相应的浮动框。

      点击成功显示,以为一切大吉了,但因为一个插件需要再设置初始化,设置成功后发现 因为插件使用的是一个div,如果有两个浮动框的话会导致初始化失败,不巧的是这还是个主要功能。


      想了想,就使用ng-if在他需要的时候再去创建这个dom节点,结果就是插件初始化成功了,但是ng-model的值取不到了。我转而用了ng-show去判断浮动框的显示与否,发现好像又回到了起点,插件初始化又不成功了,以前使用这两个的时候知道ng-if是通过判断表达式的值为true或false来决定是否创建dom节点,ng-show是通过判断表达式的值用css的display:none和display:block来显示和隐藏。想想自己的需求知道用ng-show是铁定不成功的,怎么办?查呗。

      经过提问和查阅之后,解释是这样的:官方解释ng-if :表达式内值为true是,生成标签内的DOM,否则移除官方解释ng-show:表达式内值为true是,显示标签内的DOM,否则隐藏。ng-if同no-show和ng-hide指令最本质的区别是,它不是通过CSS显示或隐藏DOM节点,而是真正生成或移除节点。ng-if 表达式内的值初始为false的时候 他里面的由input的 model绑定的scope是不会存在作用域里面的,当if的值为true的时候,相当于生成了一个新的SCOPE值,但是原先的watch仍然是检测不到新生成的model的值的。

      这也就是说:

        ng-if这个指令单独开了一个作用域,它只可以继承,不可以进行往外传值,所以,必须要在要传值的地方给加上$parent

        例如我要将(ng-model=“item”),我要获得query,这是打印不出的,只能(ng-model=“$parent.item”);

      搜嘎,问题解决,大吉大利!

  • 相关阅读:
    软件工程课程总结
    团队-student_blog-最终程序
    课后作业-阅读任务-阅读提问-3
    课后作业-阅读任务-阅读笔记-3
    《团队-爬虫豆瓣top250项目-团队一阶段互评》
    爬虫豆瓣top250项目-开发文档
    《结对-英文词频统计-结对项目总结》
    JAVA实现最短距离算法之迪杰斯特拉算法
    切词框架jcseg,入门
    本人对于netty框架的一些理解,怎么与网站上的websock建立连接
  • 原文地址:https://www.cnblogs.com/daimo/p/8472576.html
Copyright © 2020-2023  润新知