Проблема с FormGroup Angular (отсутствует в типе)

Когда я запускаю команду ng serve --prod, у меня возникает следующая проблема:

ОШИБКА в ng:///home/cristopher_ramirez/Development/angularProjects/lazyPagesRouterTest/src/app/service-order/add-service-order/add-service-order.component.html (28,51): аргумент типа ' FormGroup" не может быть назначен параметру типа "ServiceOrder".
Свойство "cylinderRefsList" отсутствует в типе "FormGroup".

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

это мой HTML-код (add-service-order.component-html):

<div class="container">
<form [formGroup]="serviceOrderForm" novalidate (ngSubmit)="save(serviceOrderForm)">
<div formArrayName="cylinderRefsList">
  <div class="card cardCylinder">
    <div *ngFor="let cylinder of serviceOrderForm.controls['cylinderRefsList']['controls']; let i=index" class="panel panel-default">
      <div class="card-header">
        <span>Cilindro {{i + 1}}</span>
        <button type="button" class="close" aria-label="Close" *ngIf="serviceOrderForm.controls['cylinderRefsList']['controls'].length > 1"
          (click)="removeCylinder(i)">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="card-body" [formGroupName]="i">
        <app-cylinder [group]="serviceOrderForm.controls['cylinderRefsList']['controls'][i]"></app-cylinder>
      </div>
    </div>
  </div>
</div>

Я следовал этому руководству https://scotch.io/tutorials/how-to-build-nested-model-driven-forms-in-angular-2, так что, как вы можете видеть, я фактически добавил цилиндрRefsList в группу форм (мой файл TS почти то же, что и в руководстве) с той лишь разницей, что я использую модели вместо интерфейса.

РЕДАКТИРОВАТЬ 1: это мой файл TS

export class AddServiceOrderComponent implements OnInit {

  public serviceOrderForm: FormGroup;

  errMessage: string;
  model;
  structures: any = [];
  structureName = 'Obras';
  isStructure = false;
  isDate = false;
  websafeKey: any;
 orderDate: any;
 dateTicks = 0;
 role: string;

  constructor(
    private router: Router,
   private structureService: StructureService,
 private serviceOrderService: ServiceOrderService,
 private fb: FormBuilder,
 private userService: UserService
 ) {
 this.structureService.getAllStructures().subscribe(data => {
   this.structures = data;
   console.log(this.structures);
 });
 this.role = this.userService.getRoleUser();
 }

 ngOnInit() {
this.serviceOrderForm = this.fb.group({
  cylinderRefsList: this.fb.array([])
 });
 this.addCylinder();
   }

   initCylinders() {
    return this.fb.group({
     colado: ['', Validators.required],
       ruptura: ['', Validators.required],
     edad: ['', Validators.required],
     rev: ['', Validators.required],
     altura: ['', Validators.required],
     area: ['', Validators.required],
    cargaKn: ['', Validators.required],
   cargaKgf: ['', Validators.required],
    resistenciaKgf: ['', Validators.required],
    resistenciaMpa: ['', Validators.required],
    resistenciaProy: ['', Validators.required],
    resistenciaPorce: ['', Validators.required],
    ubicacion: ['', Validators.required]
  });
  }

  addCylinder() {
   const control = 
 <FormArray>this.serviceOrderForm.controls['cylinderRefsList'];
const addrCtrl = this.initCylinders();
control.push(addrCtrl);
   }

  removeCylinder(i: number) {
   // remove address from the list
    const control = 
 <FormArray>this.serviceOrderForm.controls['cylinderRefsList'];
control.removeAt(i);
  }

  save(model: ServiceOrder) {
      this.orderDate = new Date(this.model.year, this.model.month - 1, 
    this.model.day);
     this. dateTicks = ((this.orderDate.getTime() * 10000) + 
  621356076000000000);
  this.serviceOrderService.postServiceOrder(this.dateTicks, this.websafeKey, 
   model['controls']['cylinderRefsList']['value'] )
  .subscribe(data => {
    if (this.role === 'Admin' || this.role === 'Director') {
      this.router.navigate(['/home/service-order']);
    } else if (this.role === 'Tecnico') {
      this.router.navigate(['/home-tecnician/service-order']);
    } else if (this.role === 'Supervisor') {
      this.router.navigate(['/home-supervisor/service-order']);
    }
  });
  }

  structureInfo(structureName: string, websafeKey: string) {
this.structureName = structureName;
this.websafeKey = websafeKey;
 }

person Christopher Angel    schedule 19.12.2017    source источник
comment
Что за строка 28?   -  person Chau Tran    schedule 20.12.2017
comment
@ChauTran — это ‹div formArrayName=cylinderRefsList›   -  person Christopher Angel    schedule 20.12.2017
comment
надо посмотреть твой ts файл   -  person Chau Tran    schedule 20.12.2017
comment
я отредактировал свой вопрос, чтобы добавить его.   -  person Christopher Angel    schedule 20.12.2017
comment
Вероятно, когда вы впервые запускаете форму, элемент 0 в цилиндрическом спискеRefsList находится в неправильном интерфейсе.   -  person Chau Tran    schedule 20.12.2017


Ответы (1)