FormControl в динамических формах на основе структуры JSON / Ошибка: невозможно создать свойство 'validator' для строки 'rubrique.formControl' - PullRequest
0 голосов
/ 16 мая 2018

Я использую динамическую форму, основанную на структуре JSON. Когда я определяю formControl и пытаюсь вызвать его из mat-error, я получаю сообщение об ошибке. Я использую formGroup с formControlName, но я не решил его.

JSON Структура:

{ 
  "codeFormulaire":"DCR0",
  "libelleFormulaire":"La demande de crédit",
  "idDossier": "ID",
  "sections": [
    {
      "codeSection":"ACT",
      "libelleSection": "Activité",
      "sousSections": [
        {
          "codeSousSection": "AC1",
          "libelleSousSection": "Activité par défaut",
          "lignes": [
            {
              "rubriques": [
                {
                  "codeRubrique":"OCTDCO06",
                  "description": "CRR proposé",
                  "typeRubrique": "liste",
                  "valeur": "",
                  "isRequired": true,
                  "options": [
                       {
                        "valeur":"Volvo",
                        "label":"voiture-volvo",
                        "isSelected": true
                      }, 
                      {
                        "valeur":"A6",
                        "label":"voiture-audi",
                        "isSelected": false
                        }     
                    ]
                 },

                {
                  "codeRubrique":"OCTDCO50",
                  "description": "Date de cloture",
                  "typeRubrique": "date",
                  "valeur": "",
                  "isRequired": true
                }

              ]
            }
          ]
        }

HTML КОД:

<button mat-raised-button class="enregistrer-color">Enregistrer</button>
<button mat-raised-button class="valider-color">Valider</button>
<div *ngFor="let section of sections; let l = index">
  <mat-toolbar color="accent">
    <div color="primary" class="section-title">{{ section.libelleSection }}</div>
  </mat-toolbar>
  <div *ngFor="let sousSection of section.sousSections; let k = index">
    <mat-toolbar color="warn" class="section-title">{{ sousSection.libelleSousSection }}</mat-toolbar>
    <div class="container">
      <div *ngFor="let ligne of sousSection.lignes; let j = index">
        <mat-grid-list cols="2" rowHeight="75px">
          <div *ngFor="let rubrique of ligne.rubriques; let i = index">
            <div class="example-container">
              <mat-grid-tile>
                <div *ngIf="rubrique.typeRubrique === 'date'"                    
                </div>
                <div *ngIf="rubrique.typeRubrique === 'liste'">
                  <label>{{ rubrique.description }} : </label>
                  <mat-form-field>
                    <mat-select [(ngModel)]="rubrique.valeur"
                                formControl="rubrique.formControl">
                      <mat-option *ngFor="let option of rubrique.options" [value]="option.label">
                        {{option.valeur}}
                      </mat-option>
                    </mat-select>
                    <mat-error *ngIf="rubrique.formControl.erros.required">
                      Ce champs est <strong>obligatoire !</strong>
                    </mat-error>
                  </mat-form-field>

Код TypeScript: это функция для получения формы (структура JSON), и после этого я использую эти циклы для инициализации каждого formControl, но у меня есть эти ошибки, и когда я отлаживаюсь, я не могу получить доступ к этим циклам / ошибкам: Невозможно создать свойство ' валидатор 'on string' rubrique.formControl '

for (let i = 0; i < this.sections.lenght; i++) {
      this.controls[i] = new Array();
      for (let j = 0; j < this.sections.sousSections.lenght; j++) {
        this.controls[i][j] = new Array();
        for (let k = 0; k < this.sections.sousSections.lignes.lenght; k++) {
          this.controls[i][j][k] = new Array();
          for (let l = 0; l < this.sections.sousSections.lignes.rubriques.lenght; l++) {
            if (this.sections.sousSections.lignes.rubriques[l].isRequired) {
              rubrique.formControl = new FormControl('', Validators.required);
              this.form.addControl(rubrique.formControl);
            }
          }
        }

Чтобы создать массив с 4 измерениями, я определяю в каждом цикле новый Array ().

1 Ответ

0 голосов
/ 16 мая 2018

Вы присваиваете строку "rubrique.formControl" свойству formControl:

<mat-select [(ngModel)]="rubrique.valeur" formControl="rubrique.formControl">

Вместо этого необходимо связать свойство formControl с объектом FormControl:

<mat-select [(ngModel)]="rubrique.valeur" [formControl]="rubrique.formControl">
...