观察指令控制器不工作

Watch in directives controller not working

我试图在我通过 template.But 注入的指令控制器中观察一个范围变量,监听器似乎永远不会触发。

http://plnkr.co/edit/a9UWiVZlKhaKf0Z0utSG?p=preview

var angularSimpleAuth = angular.module('angularSimpleAuth', []);
angularSimpleAuth.directive('simpleAuthUsername',function(){
        return {
            restrict: 'A',
            scope:{},
            template:'<input type="text" ng-model="userName" />',
            controller:function($scope){
                $scope.$watch('userName',function(val){
                    console.log('Value'+val);
                });
            },
            link: function($scope, elem, attrs,controllers) {
                console.log('In link for username');

            }
        };
    })

谁能告诉我我做错了什么here.Any帮助感谢 谢谢

问题是您将指令应用于输入元素。由于该指令已经在呈现输入元素,因此必须将其标记为元素或应用属性替换 true。

将您的 HTML 更改为:

    <simple-auth-username></simple-auth-username>

指令为:

angularSimpleAuth.directive('simpleAuthUsername',function(){
    return {
        restrict: 'E',
        scope:{},
        template:'<input type="text" ng-model="userName" />',
        controller:function($scope){
            $scope.$watch('userName',function(val){
                console.log('Value'+val);
            });
        },
        link: function($scope, elem, attrs,controllers) {
            console.log('In link for username');

        }
    };
})