javascript - scope.$eval 在自定义指令的链接函数中不起作用

Question

我需要创建自定义指令

<my-input id="myInputElementId1"
          label="My Label 1"
          ng-model="myInputElementModel1"
          ng-change="resetFormFieldErrors(form.myInputElementId1)"
          ng-required="true"></my-input>

应该像下面这样工作:

<div>
    <label for="myInputElementId1"><span>My Label 1</span></label>
    <input id="myInputElementId1"
           name="myInputElementId1"
           type="text"
           ng-model="myInputElementModel1"
           ng-change="resetFormFieldErrors(form.myInputElementId1)"
           ng-required="true"/>
</div>

myInput.directive.js代码如下:

"use strict";

module.exports =
    function myInput() {
        return {
            require: "ngModel",
            scope: {
                model: "=ngModel",
                id: "@",
                label: "@",
                required: "@?"
            },
            link: function (scope, element, attrs) {
                scope.$watch("model", function (newValue, oldValue) {
                    if (newValue != oldValue) {
                        if (attrs.ngChange) {
                            console.log("Should execute: " + attrs.ngChange);
                            scope.$eval(attrs.ngChange);
                        }
                    }
                });
            },
            templateUrl: "app/campaign/templates/search/myInput.html"
        };
    };

myInput.html代码如下:

<div>
    <label for="{{id}}"><span>{{label}}</span></label>
    <input id="{{id}}" name="{{id}}" type="text" ng-model="model" ng-required="required"/>
</div>

新指令的用法示例如下:

<my-input id="myInputElement1"
          label="My Label 1" ng-model="myInputElement1"
          ng-change="resetFormFieldErrors(form.myInputElement1)"></my-input>

<my-input id="myInputElement2"
          label="My Label 2"
          ng-model="myInputElement2" ng-change="resetFormFieldErrors(form.myInputElement2)"></my-input>

<my-input id="myInputElement3"
          label="My Label 3"
          ng-model="myInputElement3" ng-change="resetFormFieldErrors(form.myInputElement3)"></my-input>

每次当我更改输入元素的文本时 console.log("Should execute: "+ attrs.ngChange) 工作正常，但 scope.$eval(attrs.ngChange) 不起作用，并且不存在执行错误。

有人请帮助我。

Answer 1

我相信您需要在父作用域上调用 $eval，所以类似于 scope.$parent.$eval();

这是必要的，因为指令中的 scope 创建了一个独立的范围，但 attrs.ngChange 引用了父范围。