角度5反应形式复选框发送对象

Question

在一个被动的形式中，我需要一个复选框来将一个打字的对象发送到Typescript文件，而不仅仅是一个字符串或一个数字。当我尝试使用value={{ myObject }}时，我得到[object Object]。是否可以检索正确的对象？这是我的代码：

unite.ts：

import { Deserialize } from './deserialize.model';
import { Arme, Armes } from './armes';

export class Unite implements Deserialize<Unite> {
  id: number;
  race: string;
  cat: number;
  unite: string;
  profil: string;
  type: string;
  taille: number;
  m: number;
  cc: number;
  ct: number;
  f: number;
  e: number;
  pv: number;
  i: number;
  a: number;
  cd: number;
  svg: string;
  promote: any;
  cost: number;
  armes: Array<Arme>;

  deserialize(input: any): Unite {
    Object.assign(this, input);
    this.armes = input.armes.map((arme: Arme) => new Arme().deserialize(arme));
    return this;
  }
}

armes.ts：

import { Deserialize } from './deserialize.model';

export class Arme implements Deserialize<Arme> {
  id: number;
  nom: string;
  race: Array<string>;
  portee: number;
  f: number;
  svg: string;
  regles: string;

  deserialize(input: any): Arme {
    Object.assign(this, input);
    return this;
  }
}

export class Armes implements Deserialize<Armes> {
  deserialize(input: any): Armes {
    Object.assign(this, input);
    return this;
  }
}

deserialize.model.ts

export interface Deserialize<T> {
  deserialize(input: any): T;
}

团结-form.ts：

import { Arme } from './armes';

export class UniteForm {
  private _id: number;
  private _nom: string;
  private _size: number;
  private _weapons: Array<Arme>;
  private _staff: Array<string>;

  construct(
    id: number,
    nom: string,
    size: number,
    weapons: Array<Arme>,
    staff: Array<string>
  ) {
    this._id = id;
    this._nom = nom;
    this._size = size;
    this._weapons = weapons;
    this._staff = staff;
  }

  get id(): number {
    return this._id;
  }
  set id(id: number) {
    this._id = id;
  }

  get nom(): string {
    return this._nom;
  }
  set nom(nom: string) {
    this._nom = nom;
  }

  get size(): number {
    return this._size;
  }
  set size(size: number) {
    this._size = size;
  }

  get weapons(): Array<Arme> {
    return this._weapons;
  }
  set weapons(weapons: Array<Arme>) {
    this._weapons = weapons;
  }

  get staff(): Array<string> {
    return this._staff;
  }
  set staff(staff: Array<string>) {
    this._staff = staff;
  }
}

unite.component.ts

import { Component, OnInit, OnChanges, Input, Output, EventEmitter } from '@angular/core';
import { FormBuilder, FormControl, FormGroup,  Validators } from '@angular/forms';

import {Unite} from '../../../models/unite';
import { Arme, Armes } from '../../../models/armes';
import { UniteForm } from '../../../models/unite-form';

import { ApiService } from '../../../services/api.service';

@Component({
  selector: 'wab-unite',
  templateUrl: './unite.component.html',
  styleUrls: ['./unite.component.css']
})
export class UniteComponent implements OnInit, OnChanges {

  public uniteFormGroup: FormGroup;
  public selectedUnite: Unite;

  constructor(private _fb: FormBuilder, private apiService: ApiService) { }

  ngOnInit() { }

  ngOnChanges() {
    this.apiService.getUniteData(this.gotRace, this.gotUnite)
      .subscribe(unite => {
        this.selectedUnite = unite;
        this.createForm(this.selectedUnite);
      });
  }

  private createForm(unite: Unite) {
    this.uniteFormGroup = this._fb.group({
      id: unite['id'],
      nom: unite['unite'],
      taille: unite['taille'],
      weapons: '',
      staff: ''
    });
  }

unite.component.html：

  <label for="armes">Armes:</label>
  <mat-selection-list id="armes" formControlName="weapons">
    <mat-list-option *ngFor="let weapon of selectedUnite.armes" value="{{ weapon.id }}">{{ weapon.nom }}
    </mat-list-option>
  </mat-selection-list>

非常感谢您的宝贵帮助！