美文网首页
angularJS里的ng-if的坑

angularJS里的ng-if的坑

作者: 前端搬砖工曹果 | 来源:发表于2018-10-25 15:53 被阅读15次
    情景:

    一般我们写代码的时候需要根据某个数据的状态来控制它在页面里的显示隐藏。

    实现:

    使用ng-show,ng-hideng-if可以实现。

    区别:

    ng-show/ng-hide是通过修改CSS样式方式控制元素显示与隐藏,对应的DOM元素会一直存在于当前页面中,而ng-if根据表达式的值动态的在当前的页面中添加删除页面元素。如果赋值表达式的值为false,那么这个元素就会从页面中删除,否则会添加一个元素。

    ng-if的坑

    ng-if这个指令会在运行时单独创建一个自己的作用域,必须要在要传值的地方给加$parent,否则在ng-if所处的标签范围内绑定的变量是取不到值的。
    例如将ng-model=“item”改为ng-model=“$parent.item”

    相关文章

      网友评论

          本文标题:angularJS里的ng-if的坑

          本文链接:https://www.haomeiwen.com/subject/awfctqtx.html