Angular $ parser在带有输入模板的attribute指令中不起作用

时间:2014-06-21 02:58:35

标签: javascript angularjs angularjs-directive

我真的需要把它作为一个属性,公司规则。

这是jsfiddle:

http://jsfiddle.net/M3sZN/

当我输入输入框时,我似乎无法让console.logs用于$ parser。

var module = angular.module("demo", []);

module.directive('lowercase', function() {
    return {
        require: 'ngModel',
        restrict: 'A',
        scope: {
            ngModel: '='
        },
        link: function(scope, element, attr, ngModelCntrl) {
            ngModelCntrl.$formatters.unshift(function (text) {
                 console.log('from formatters: ');
            });
            ngModelCntrl.$parsers.push(function (text) {
                console.log('from parsers: ');
            });


        },
        template: '<input ng-model="ngModel" type="text">',
    };
});

function Demo($scope) {
    $scope.data = 'Some Value';
}

这是HTML:

<div ng-app="demo" ng-init="" ng-controller="Demo">
    <div lowercase ng-model="data"></div>    
</div>

我已经尝试了很多,但这包括以下内容:

  • 改为使用require: '^ngModel',
  • 删除范围,但我需要用于我正在使用的其他指令。
  • 更改名称以使用myModel传入模型。
  • 还有许多我忘记的其他事情。

修改

我能够像这样工作:http://jsfiddle.net/M3sZN/2/

HTML:

<div ng-app="demo" ng-init="" ng-controller="Demo">
    <input lowercase ng-model="data" type="text">    
</div>

JS

var module = angular.module("demo", []);

module.directive('lowercase', function() {
    return {
        require: 'ngModel',
        restrict: 'A',
        link: function(scope, element, attr, ngModelCtr) {
            ngModelCtr.$formatters.unshift(function (text) {
                 console.log('from formatters: ');
            });
            ngModelCtr.$parsers.push(function (text) {
                console.log('from parsers: ' + text);
                return text;
            });
        }
    };
});

module.controller('Demo', Demo);

function Demo($scope) {
    $scope.data = 'Some Value';
}

删除模板并将模型直接放在输入字段上。

这不是理想的,因为我想使用模板,因为我有很多需要在输入字段上输入的属性。我希望每次使用此指令时都避免重复。

0 个答案:

没有答案