Как бороться с этой ошибкой? 'В типе отсутствует подпись индекса ...' - PullRequest
Новая
       4

Как бороться с этой ошибкой? 'В типе отсутствует подпись индекса ...'

0 голосов
/ 13 февраля 2020

Я пытаюсь обогатить этот очень хороший урок от Джо sh Хикс

https://medium.com/@joshblf / dynamici c -nested-реактивные-формы-в-angular -654c1d4a769a

путем добавления некоторых FormGroups и FormArrays, но в классе модели формы 

export class TeamForm {

  group1 = new FormGroup(new MyGroupForm(new MyGroup()));

  constructor(team: Team) {

    if (team.group1) {
      this.group1.setValue(team.group1);
    }
  }
}

эта строка 

group1 = new FormGroup(new MyGroupForm(new MyGroup()));

возвращает приведенную ниже ошибку 

Argument of type 'MyGroupForm' is not assignable to parameter of type '{ [key: string]: AbstractControl; }'.
Index signature is missing in type 'MyGroupForm'.

Вот MyGroupForm класс 

import { FormControl, Validators } from "@angular/forms";
import { MyGroup } from "./mygroup.model";

export class MyGroupForm {
  Input1 = new FormControl();
  Input2 = new FormControl();

  constructor(groupValue: MyGroup) {

    this.Input1.setValue(groupValue.Input1);
    this.Input1.setValidators([Validators.required]);

    this.Input2.setValue(groupValue.Input2);
  }
}

, а это MyGroup класс 

export class MyGroup {
  Input1: string;
  Input2: string;

  constructor(value?) {
    if (value) {
      this.Input1 = value.Input1;
      this.Input2 = value.Input2;
    }
  }
}

Тот же код в stackblitz, возвращает ту же ошибку в Редактор кода, но с хорошей сборкой!

Теперь вот странная вещь!

Если я заменим точку (.) в этом имени файла mycontrol-form.model.ts на запятую (,) следующим образом: mycontrol-form,model.ts ошибка исчезает. Но это только в stackblitz!

https://stackblitz.com/edit/form-nested-formarray-with-service

Очевидно, я делаю что-то не так, и я был бы очень признателен за небольшую помощь в этом вопросе ...

1 Ответ

0 голосов
/ 14 февраля 2020

Сегодня я узнал, как реализовать индексные подписи в классах. Чего мне не хватало, так это того, что я не определил никакого типа для объявленных переменных в классе. Итак, в моем случае решение было таким простым: 

export class MyGroupForm  {

  Input1: FormControl = new FormControl();
  Input2: FormControl = new FormControl();
}

Теперь, если мы хотим определить общую модель для наших объектов, мы создаем интерфейс типа и реализуем его в нашем классе следующим образом: 

interface IndexSignature {
  [key: string]: FormControl;
}

export class MyGroupForm implements IndexSignature {
  [key: string]: FormControl;

  Input1 = new FormControl();
  Input2 = new FormControl();
}

если наши объекты имеют более одного типа, мы можем объявить их следующим образом: 

interface IndexSignature {
  [key: string]: FormControl | FormArray;
}

export class MyGroupForm implements IndexSignature {
  [key: string]: FormControl | FormArray;

  Input1 = new FormControl();
  Array1 = new FormArray([]);
}

или в этом конкретном c случае, когда оба FormControl и FormArray имеют тип AbstractControl мы просто определяем этот тип: 

interface IndexSignature {
  [key: string]: AbstractControl;
}

export class MyGroupForm implements IndexSignature {
  [key: string]: AbstractControl;

  Input1 = new FormControl();
  Array1 = new FormArray([]);
}

Это мое понимание сигнатур индекса. Если кто-то хочет что-то добавить или исправить, не стесняйтесь делать это ...

...