1

我希望更改在表单字段上的 ng-show 指令中定义的功能,以显示表单字段的问题。

例如:

<span class="help-inline" ng-show="showError(schoolSignup.last_name, 'required')">This field is required</span>

schoolSignup.last_name该字段对模型控制器的引用在哪里,并且'required'是我正在寻找的验证属性。

在控制器中定义为

$scope.showError = function(ngModelController, error) {
   return ngModelController.$dirty && ngModelController.$error[error];
 };

我一直在努力想办法把它移到指令中,这样我就不必在每个控制器中重新定义它了。我正在考虑将其定义为...

<span class="help-inline" show-error="required" field="schoolSignup.last_name">This field is required</span>

这是据我所知

    .directive('showError', function () {
    return {
        restrict: 'A',
        scope:{
            field: "="
        },
        link: function(scope, elem, attrs, ctrl)
        {
            var errorType = attrs.showError;

            scope.errors = scope.field.$error[errorType];

           // NOT WORKING YET
        }
    };
});

我怎样才能做到这一点??

4

1 回答 1

2

你在正确的轨道上;但是,中的点formName.fieldName会给您使用object[field]语法带来麻烦。$parse相反,您可以使用服务(文档)很好地做到这一点:

app.directive("showError", function($parse) {
  return {
    link: function(scope, elem, attrs) {
      // Returns a function that, when called with a scope,
      // evaluates the expression in `attrs.field` (e.g.
      // "schoolSignup.last_name") on the scope.
      var getter = $parse(attrs.field);

      // Every time a digest cycle fires...
      scope.$watch(function() {
        // ...get the input field specified in the `field` attribute...
        var field = getter(scope);
        // ...and check to see if the error specified by the
        // `show-error` attribute is set.
        if (field.$dirty && field.$error[attrs.showError]) {
          elem.show();
        } else {
          elem.hide();
        }
      });
    }
  };
});

这是一个工作示例:http: //jsfiddle.net/BinaryMuse/Lh7YY/

于 2013-09-13T05:57:07.737 回答