ui-如果与 ng-model 冲突？

Question

非常简单的代码：

    <div ui-if="showMemberId">
        <input ng-model="memberId" ng-change="test()" id="memberId" name="memberId" class="text" type="text">
    </div>

控制器用这个：

$scope.memberId = 'SDF';
$scope.test = function test(){
    console.log($scope.memberId);
};
$scope.showMemberId = true;

奇怪的是，ng-change 有效但 ng-model 无效。当我输入输入时，它只是一遍又一遍地将字符串 SDF 记录到控制台，因为模型没有改变。

有什么想法吗？

Answer 1

似乎 ui-if 正在像 ng-if 那样创建子作用域。因此，外部 memberId 作用域将不同于 ui-if 内部的 ng-model。在这种情况下，您需要在定义 ng-model 时遵循 dot rule。基本上当它创建一个子作用域时，它通常是从父作用域继承的。 prototypal inheritance 适用于 object 类型而不适用于 primitive types

要使其正常工作，您需要在控制器内部定义对象，如 $scope.model ={} 并在其中定义所有属性。

标记

<div ui-if="showMemberId">
    <input ng-model="model.memberId" ng-change="test()" 
     id="memberId" name="memberId" class="text" type="text"/>
</div>

控制器

$scope.model = {}; //made an object type model

I'd encourage you to use ng-if instead of ui-if, as angular does provide the same functionality.

ui-如果与 ng-model 冲突？

ui-if clashing with ng-model?

javascript

angularjs

angular-ngmodel

prototypal-inheritance