Angular: Hilfe für direkt bearbeitbares Formular

Question

Ich versuche, ein direkt bearbeitbares Formular zu erstellen, dessen Steuerelemente auf Knopfdruck zwischen editierbaren und reinen Ansichtsmodi umschalten sollten (ich will nicht einzelne Steuerelemente, die angeklickt werden müssen, um den Bearbeitungsmodus umzuschalten).

Ich habe dieses StackBlitz erstellt, wo ich eine Fehlermeldung bekomme, No provider for NgControl. Ich möchte keine Formularelemente über jede der bearbeitbaren Steuerkomponenten legen, die ich erstellen möchte. Bitte hilf mir dabei.

Meine Kontrolle gedacht ist so etwas wie, <editable-control [mode]="formMode" type="text"></editable-control>

Answer 1

Ihre individuelle Form Komponente die ControlValueAccessor-Schnittstelle implementiert, deshalb braucht es die NgControl Anbieter. Sie müssen die ReactiveFormsModule anstelle der FormsModule verwenden.

Also muss man es aus @angular/forms importieren und auf die Einfuhren Array der entsprechenden NgModule hinzufügen:

// ... 
import { ReactiveFormsModule } from '@angular/forms'; 

@NgModule({ 
    imports: [ 
    // ... 
    ReactiveFormsModule 
    ] 
}) 
// ... 

Sie benutzerdefinierte Komponente nutzen zu können, es zusammen mit formGroup Richtlinie verwenden können. Zum Beispiel:

<form [formGroup]="myForm"> 
    <editable-control [mode]="formMode" type="text" formControlName="myText"> 
    </editable-control> 
</form>