zoukankan      html  css  js  c++  java
  • angularjs input使用ng-model双向绑定无效bug解决

    解决办法

    A.将绑定的变量写成对象的形式

    $scope.inputText = {value:"测试"}

    页面绑定

    <input type="type" ng-model="inputText.value"/>

    B.另一种解决办法: 把ng-if 改为 ng-show 就可以了

    ng-model 在 ng-if 里面无效

    ng-if指令的功能与ng-show指令相似,都用于控制元素的显示与隐藏,但两者又有区别,ng-if指令会移除DOM原有的元素,而ng-show指令只是将元素的”display”属性值设置为”none”。因此,在使用时必须根据实际的需要进行选择性使用。

     ng-if指令会创建一个子级作用域,因此,如果在ng-if指令中添加了元素,并向元素属性增加ng-model指令,那么ng-model指令对应的作用域属于子级作用域,而并非控制器注入的$scope作用域对象,这点在进行双向数据绑定时,需要引起注意。

     为什么?

    ng-if里面会生成一个子域,想要ng-model生效,需要在$scope创建一个子对象,才行,如$scope.obj,再将ng-model绑定到obj

     解决问题:

    1.使用ng-show(或ng-hide)可以间接解决这个问题。

    2.使用$scope创建一个子对象

    $scope.a = {num: '1'};

  • 相关阅读:
    react系列教程
    实现 React Hooks
    实现 call、apply、bind
    Webpack概念
    写一个简单的模板引擎
    闭包和let块级作用域
    react系列(六)Redux Saga
    react系列(五)在React中使用Redux
    java学习12天2020/7/17
    java学习第十一天2020/7/16
  • 原文地址:https://www.cnblogs.com/jasonlai2016/p/11320772.html
Copyright © 2011-2022 走看看