从内部指令监视控制器模型值

Question

我正在尝试$viewValue从指令内部监视控制器的角度。

小提琴：http :
//jsfiddle.net/dkrotts/TfTr5/5/

function foo($scope, $timeout) {
    $scope.bar = "Lorem ipsum";

    $timeout(function() {
        $scope.bar = "Dolor sit amet";
    }, 2000);
}

myApp.directive('myDirective', function() {
    return {
        restrict: 'A',
        require: '?ngModel',
        link: function (scope, element, attrs, controller) {
            scope.$watch(controller.$viewValue, function() {
                console.log("Changed to " + controller.$viewValue);
            });
        }
    } 
});

照原样，$ watch函数不能从控制器内部捕获2秒后完成的模型更改。我想念什么？

Answer 1

$watch接受要在作用域中监视的属性的“名称”，即要求它监视值。现在将attrs.ngModel其更改为观看返回“
bar”的手表scope.bar。您可以按原样或使用的方式获取值，scope[attrs.ngModel]就像scope["bar"]再次说出的那样，与相同scope.bar。

scope.$watch(attrs.ngModel, function(newValue) {
    console.log("Changed to " + newValue);
});

为了澄清user271996的注释：scope.$eval，因为您可以将对象符号传递到ng-model属性中。即ng- model="someObj.someProperty"哪个scope["someObj.someProperty"]是无效的，因为无效。scope.$eval用于将字符串评估为实际对象，从而scope["someObj.someProperty"]成为scope.someObj.someProperty。