Brak dostawcy dla elementu ControlContainer, gdy komponent podrzędny ma element ngModelGroup

Question

Nie mogę tego zrozumieć, po prostu nie działa.

Jest to oryginalna plunker który został napisany przez Pascala Prekht, co stanowi wyjaśnienie opartych na szablonach formach:

And here jest mój widelec, który jest dokładnie to samo, z wyjątkiem Próbuję załadować jedną zestawy pól jako oddzielny element potomny.

Oto kod:

@Component({ 
    selector:'form-group-component', 
    template:` 
    <fieldset ngModelGroup="anotherAddress"> 
     <div> 
     <label>Street2:</label> 
     <input type="text" name="street2" ngModel> 
     </div> 

    </fieldset> 

    ` 
}) 
export class FormGroupComponent{ 

} 

@Component({ 
    selector: 'form-component', 
    directives:[FormGroupComponent], 
    template: ` 
    <form #form="ngForm"> 

     <form-group-component></form-group-component> 

     <fieldset ngModelGroup="address"> 
     <div> 
      <label>Street:</label> 
      <input type="text" name="street" ngModel> 
     </div> 
     <div> 
      <label>Zip:</label> 
      <input type="text" name="zip" ngModel> 
     </div> 
     <div> 
      <label>City:</label> 
      <input type="text" name="city" ngModel> 
     </div> 
     </fieldset> 

    </form> 
    ` 
}) 
export class FormComponent { 


} 

Więc po ścięciu jednego z feildsets i ładuje go wewnątrz dyrektywy indywidualne, to nie będzie już pracować !,

Istnieje kilka zamkniętych spraw, ale żaden z nich nie działa.

This i This

Answer 1

Wiem, że to stare pytanie. Ale ktoś w przyszłości może uznać to za przydatne. Miałem ten sam problem i wygląda na to, że błąd pojawia się, gdy komponent ma znacznik <form> bez dyrektywy formGroup, a moduł importuje ReactiveFormModule. Aby naprawić ten problem, upewnij się, że wszystkie znaczniki <form> mają dyrektywę formGroup, jeśli ich moduł importuje ReactiveFormModule.