dart - ダーツおよびデータ駆動型フォームで angular2 を使用すると、エラー メッセージが表示されない

Question

次のコード スニペットがあります。

.html

<form
    novalidate
    (ngSubmit) = "onSubmit()"
    [ngFormModel] = "formModel">
        <label
            class = "mdl-textfield__label"
            for = "first">First</label>
        <input
            type = "text"
            ngControl = "firstCtrl"
            (keyup) = "onInputHandler($event)"
            class = "mdl-textfield__input"
            id = "first">

        <span *ngIf =
                  "!formModel.hasError('minLength', ['formModel', 'firstCtrl'])">Invalid inputs
        for first</span>
      </div>
..
</form>

ダーツ

@Component(
    selector: 'name-form',
    templateUrl: 'name_form.html',
    directives: const [
      FORM_DIRECTIVES,
      CORE_DIRECTIVES,
      MaterialTextfield,
      MaterialButton
    ] )
class NameForm implements AfterViewInit {

  Name name = new Name( );

  ControlGroup formModel;
  Control firstCtrl = new Control( '', Validators.minLength( 2 ) );

  NameForm( FormBuilder fb ) {
    formModel = fb.group( {
      "firstCtrl": firstCtrl,
      );
  }

  void onInputHandler( event ) {
    String property = event.target.id;

    switch ( property ) {
      case 'first':
        firstCtrl.valid ? (name.first = firstCtrl.value) : name.first;
        print( name.first );
        break;
      }
...
}

テンプレートの *ngIf に問題があるのか​​もしれませんが、よくわかりません。エラーメッセージが表示されない理由を教えてください。

ありがとう

Answer 1

試してみてください：

<span *ngIf="!formModel.controls.firstCtrl.valid">Invalid inputs for first</span>

FormBuilder の hasError 関数については知りません。