Question

我刚刚开始学习AngularJS（我必须使用1.6）并且我想制作一些组件来处理表单字段以保持我的模板更整洁并限制我必须改变的地方如果我决定表单字段应该/行为不同。

到目前为止，我已经跟着这个tutorial进行了一些曲折。它们没有足够的验证，所以我希望能够传递一个字符串数组来决定如何验证该字段（即['required'，'properCase'，'notTooLong']，必要时会确保它是not null，properCase将检查第一个字母是否大写，而不是ToTong将检查它是否在10个字符以下。只是随机的例子。）

与redux-form field level validation works的方式类似。 link

但我遇到的第一个问题是如何传递数组？我的logOn.html模板看起来像这样......

<form name="compact-signin" novalidate class="col-xs-12 col-md-3">
    <text-field placeHolder="Username" ng-model="user.username" [validations]="['required']"></text-field>
    <text-field type="password" placeHolder="Password" ng-model="user.password"></text-field>
</form>

然后我尝试在text-field-component中接收它，就像这样......

import * as angular from 'angular';
import TextFieldController from './text-field.controller';

const template: string = require('./text-field.html');
const TextFieldComponent: angular.IComponentOptions = {
  template: template,
  controller: TextFieldController,
  controllerAs: 'ctrl',
  require: {
    model: 'ngModel'
  },
  bindings: {
    label: '@',
    placeholder: '@',
    type: '@',
    validations: '='
  }
};

export default TextFieldComponent;

除控制器外，它始终未定义。

接下来的问题是，我真的应该像这样处理验证吗？如果那应该在控制器（就像它）或指令中，我有点困惑？

可重用的表单元素AngularJS

0 个答案: