dart - Angular Dart表单中的细粒度错误消息

Question

我有以下形式的一些简单的验证规则:

<form name="signup_form" novalidate ng-submit="ctrl.signupForm()">
  <div class="row">
    <input placeholder="Username"
        name="username"
        ng-model="ctrl.username"
        required
        ng-minLength=3
        ng-maxLength=8>
  </div>
  <div ng-show="signup_form['username'].dirty &&
      signup_form['username'].invalid">
    <!-- ... -->
  </div>

  <button type="submit">Submit</button>
</form>

我想显示required，ng-minLength和ng-maxLength的特定错误消息，但是我无法深入到signup_form['username'].errors来获取特定错误。

我可以在 Controller 中正常访问errors映射，因为在标记中我无法获得针对特定错误的句柄。我希望能够大致执行以下操作:

<div ng-show="signup_form['username'].errors['minlength'].invalid>
    <!-- ... -->
</div>

即，在angularJS中类似以下内容:

<div ng-show="signup_form.username.$error.required">This field is required</div>

Answer 1

一个工作的例子

受this filter的启发，我再次尝试了这种方法

Angular 0.9.9

@NgFilter(name: 'errors')
class ErrorFilter {
  call(val) {
    if(val != null) {
      return val.map.keys;
    }
    return null;
  }
}

并在标记中

{{signup_form['username'].errors | errors}}

Angt 0.9.10的编辑

@NgFilter(name: 'errors')
class ErrorFilter {
  call(val) {
    if(val != null) {
      return val.keys;
    }
    return null;
  }
}

并在标记中

{{signup_form['username'].errorStates | errors}}

从我在AngularDart Github存储库中观察到的讨论中，我了解到正在有更好的解决方案。

相关的未解决问题
当此https://github.com/angular/angular.dart/pull/771降落时
希望有更好的解决方案。