angulardart / angular_components

The official Material Design components for AngularDart. Used at Google in production apps.

Home Page:https://pub.dev/packages/angular_components

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

material-dropdown-select does not work with reactive forms ngFormGroup, ngControl, ngFormControl

Antoniossss opened this issue · comments

I have following markup:

<form *ngIf="testModel !=null" [ngFormModel]="testModel">
    <input [ngFormControl]="testModel.controls['test1']"/>
    <input ngControl="test1"/>
    <material-input ngControl="test1"></material-input>
    <material-dropdown-select [ngFormControl]="testModel.controls['test2']"></materia-dropdown-select>
    <material-dropdown-select ngControl="test2"[options]="[1,2,3,4]"></material-dropdown-select>
</form>

and backcode


    testModel = FormBuilder.controlGroup({
      "test1": ["", Validators.required],
      "test2": ["", Validators.required]
    });
    testModel.controls['test2'].value;
    print( testModel.controls['test2']);

I have added directrives like


    coreDirectives,
    formDirectives,
    materialInputDirectives,

With that basic setup I got exception
dart_sdk.js:98521 EXCEPTION: Assertion failed: org-dartlang-app:///packages/angular_forms/src/directives/shared.dart:25:7
dir.valueAccessor != null
"No value accessor for () or you may be missing formDirectives in your directives list."

If I comment out first materiald-dropdown-select i got

"No value accessor for (test2) or you may be missing formDirectives in your directives list."

model is created in component constructor so lifecycle should not be an isse here .
Commenting out both dropdowns makes at least inputs work almost as expected (binding is only from input to model, updaing model does not update other inputs)

What am I doint wrong? It works with plain Angular + TS.

You have to add also "MaterialDropdownSelectComponent" and "MaterialInputComponent" in your directives list