Question

在我的一个模型中，我希望有一个具有唯一数字的数字属性。数字是可选复选框，我希望使用2路数据绑定。这样做的正确方法是什么？这是我的代码

模型

export class User {
    constructor(
        public id: number,
        public numbers: any
    ){}
}

组件

import {Component} from '@angular/core';
import {User} from "./user.model";

@Component({
  selector: 'my-page-user',
  styleUrls: ['./user.component.scss'],
  templateUrl: './user.component.html',
})

export class PageUserComponent {
numbers: number[];
model: User;
constructor() { }

ngOnInit() {  
    this.model = new User(0, new Set());
    this.numbers = Array.from(new Array(10), (x,i) => i+1);

}

模板

<form role="form" #userForm="ngForm" (ngSubmit)="onSubmit()">
   <div class="row">
      <div class="col-4 cell" *ngFor="let num of numbers; let i=index" >
         <md-checkbox [(ngModel)]="model.numbers[i]" name="numbers">{{i}}</md-checkbox>
      </div>
  </div>
</form>
{{model.numbers | json}} <!-- {"1": true, "2": true, "3": false } -->
{{model.numbers.size}} <!-- 0 -->

Answer 1

您可以听取更改，并在复选框更改时运行一些自定义代码。 e.g。

<md-checkbox (change)="$event.checked ? mySet.add(num) : mySet.delete(num)">...</md-checkbox>

Answer 2

应该是length而不是size

{{model.numbers.length}}

Plunker example

在angular2模型中使用Set属性的正确方法是什么

2 个答案: