Question

我实际上是在尝试重新创建ng-change，但在其中添加了一些延迟（在更改频率超时时自动保存）。

到目前为止，我有以下指令：

myApp.directive('changeDelay', ['$timeout', function ($timeout) {
    return {
        restrict: 'A',
        require: 'ngModel',
        scope: {
            callBack: '=changeDelay'
        },
        link: function (scope, elem, attrs, ngModel) {
            var firstRun = true;
            scope.timeoutHandle = null;

            scope.$watch(function () {
                return ngModel.$modelValue;
            }, function (nv, ov) {
                console.log(firstRun);
                if (!firstRun) {
                    console.log(nv);
                    if (scope.timeoutHandle) {
                        $timeout.cancel($scope.timeoutHandle);
                    }
                    scope.timeoutHandle = $timeout(function () {
                        //How can I pass person??
                        scope.callBack();
                    }, 500);
                }
                firstRun = false;
            });
        }
    };
}]);

使用以下控制器：

myApp.controller('MyCtrl', ['$scope', function ($scope) {
    $scope.people = [{
        name: "Matthew",
        age: 20
    }, {
        name: "Mark",
        age: 15
    }, {
        name: "Luke",
        age: 30
    }, {
        name: "John",
        age: 42
    }];

    $scope.updatePerson = function (person) {
        //console.log("Fire off request to update:");
        //How can I get person here??
        //console.log(person);
    };

}]);

此标记应该能够定义要调用的控制器范围方法以及传递给它的对象：

<div ng-app='myApp'>
    <div ng-controller="MyCtrl">
        <div ng-repeat="person in people">
            <input type="text" ng-model="person.name" change-delay="updatePerson(person)" />
        </div>
    </div>
</div>

这是一个失败的小提琴：http://jsfiddle.net/Troop4Christ/fA4XJ/

正如您所看到的，我无法弄清楚如何调用指令属性参数w /传递给它的“person”参数。

就像我说的那样，在开始时...只是试图重新创造一些“改变”的改变。如何在ng-change中完成？即

Answer 1

解决方案

隔离范围绑定应使用“＆amp;”声明而不是“=”，从而导致scope.callBack()执行updatePerson(person)给定的函数。

说明

隔离范围时，使用“@”，“=”和“＆amp;”：

“@”告诉angular要根据元素范围观察属性评估的结果
“=”告诉angular使用$parse
“＆安培;”告诉angular绑定一个将评估属性的函数（并且，作为一个选项，提供属性定义范围的扩展作为此函数调用的参数）。

因此，当您选择最后一个选项“＆amp;”时，这意味着在isolate指令范围内调用callBack()实际上将调用updatePerson(person)再次调整外部范围（不会扩展任何来自隔离范围）。

考虑范围扩展功能，您可以通过调用person替换updatePerson(person)的{{1}}参数。然后scope.callBack({person: {a:1}})在person调用范围（函数范围，而不是角度{a:1}）中为updatePerson。

将对象上下文传回AngularJS Directive的控制器回调

1 个答案:

解决方案

说明