输入不反映ngModel值

时间:2016-02-10 10:52:59

标签: angularjs angularjs-directive angularjs-scope

我正在尝试根据用户给我的json对象进行一些自定义验证。 但是,输入字段在视觉上不显示ngModel属性的值。我添加了一个plunkr来说明问题。

'use strict';

angular.module('zendantennesApp')
    .directive('validation', function ($compile, $parse) {
        return {
            scope: {
                validation: '@',
                ngModel: '@'
            },
            require: "?ngModel",
            restrict: 'A',
            compile: function(el, attrs) {
                el.removeAttr('validation');
                el.attr('ng-blur', 'evaluateExpression()');
                el.attr('ng-focus', 'assignOriginalValue()');
                var fn = $compile(el);
                return function(scope, element, attrs, ngModel){
                    ngModel.$render = function(){
                    $(element).val(ngModel.$viewValue);
                    };
                    fn(scope);
                }
            },
            controller: function($scope){
                $scope.originalValue = $scope.ngModel;
                $scope.validationObject = JSON.parse($scope.validation.replace(/'/g, '"'));
                $scope.evaluateExpression = function(){
                    console.log($scope.validationObject);
                };
                $scope.assignOriginalValue = function(){
                    $scope.originalValue = $scope.ngModel;
                    console.log($scope.originalValue);
                }
            }
        }
    }); 

https://plnkr.co/edit/1qYxCiSZWHgVeN9CEpxw?p=preview

1 个答案:

答案 0 :(得分:1)

验证指令将具有隔离范围,因此除非您在编译期间明确提及,否则将无法访问父范围值。将fn(scope);替换为fn(scope.$parent);

Updated Plunker