具有两个输入元素的Angular指令:无法获得$ watch来处理ng-model值

时间:2015-03-22 10:56:45

标签: javascript angularjs angularjs-directive angularjs-scope

我正在尝试编写一个Angular指令,该指令包含一个包含两个输入字段的模板(最终这将是一个日期和时间选择器),并且不能让$ watch触发任何一个输入值更改。我有一个测试:

HTML

<tw-input-test label="Test" ng-model="myModel.value"></tw-input-test>

app.directive("twInputTest", function(){
    return{
        restrict: 'E',
        require: 'ngModel',
        scope:{ label:'=' },
        templateUrl:"templates/tw-input-test.html",
        link: function(scope,element,attrs){
            scope.twone=42;
            scope.twtwo=27;
            scope.updateTest=function(){
                scope.label= scope.twone.toString()+"-"+scope.twtwo.toString();
            }
            scope.$watch(scope.twone,scope.updateTest, true);
            scope.$watch('scope.twtwo',scope.updateTest, true);
        }
    };
});

模板

<div class="form-item">
    <span>{{label}}</span>
    <input type='number' style="width:80px" ng-model="twone">
    <input type='number' style="width:80px" ng-model="twtwo">
</div>

我可以看到scope.twone,scope.twtwo的值在更改输入框时会改变(使用Chrome开发工具),但只在最初调用链接函数时调用updateTest()。

0 个答案:

没有答案