Question

我有一个简单的角度问题 - 我认为这可能是一个无法在这里看到树木的情况。

我有一个带有指令的输入字段。目的是最终比较新旧数据并显示弹出窗口。但是，只要我将directive属性添加到输入字段，该值就会消失：

在这里插入：http://plnkr.co/edit/BQvKGe6kjuD0ThPBYJ4d?p=preview

HTML：

First Name:
<input type='text' ng-model='currentEditItem.strFirstName' name='strFirstName' id='strFirstName' 
cm-popover="currentEditItem.personOldData.strFirstName"/>

<br><br>
ngModel: {{currentEditItem.strFirstName}} <br>
cmPopover: {{currentEditItem.personOldData.strFirstName}}

JS

var app = angular.module('app', []);

app.controller('Ctrl', function ($scope) {

    $scope.currentEditItem = {};
    $scope.currentEditItem.strFirstName = "Bob";
    $scope.currentEditItem.personOldData = {};
    $scope.currentEditItem.personOldData.strFirstName = "Roger";    
});


app.directive("cmPopover", function () {
    return {
        scope: {
            ngModel: "=",
            cmPopover: "="
        },
        link: function (scope, elem, attrs) {
            console.log("ngModel", scope.ngModel);
            console.log("cmPopover", scope.cmPopover);
        }
    }
});

如果您转到Plunk并删除cm-popover属性，则输入字段将填充模型中的值。添加属性后，尽管模型仍在具有正确值的范围内，但值仍会消失。

Answer 1

在您的指令中，您声明了隔离范围。此输入的范围现在是此隔离范围，因为它是指令元素。它正在寻找隔离范围中不存在的currentEditItem对象

Answer 2

ngModel不会为自己创建新的隔离范围，因此$watch无需在其内部代码中对$parent进行硬编码即可ngModel。但是，然后在同一个DOM节点上添加另一个指令，为自己创建一个隔离的范围。假设您在DOM节点上只能有一个独立的作用域，并且基本上强制cmPopover使用/使用创建的同一作用域ng-model="currentEditItem.strFirstName"。

因此，在编写$scope时，您实际上正在解决cmPopover指令中的ng-model="$parent.currentEditItem.strFirstName"，而不是（父）控制器中的{{1}}。您可以使用{{1}}检查是否属于这种情况 - 它会起作用。

有一段很长的对话here，其中有很多可行的解决方法和解决方案，可以产生实际的fix in release 1.2.0。

这么长的故事简短：至少更新到AngularJS 1.2.0，这将有效。

指令正在删除输入字段的值

2 个答案: