使用Angular 2引导多选获取价值

Question

我想在我的多选下拉列表中获取所选选项的值。 但我没有通过ngModel.. 完成这项工作

这里是html：

 <div class="col-xs-offset-1 col-xs-3">
    <form class="btn-group" id="select-form">
        <select id="dropdown-list" multiple="multiple" [(ngModel)]="selectedObject"></select>
       <button type="reset" id="reset-button" class="btn btn-default"><span class="glyphicon glyphicon-refresh"></span></button>
    </form>
</div>

这里是for循环，它将选项附加到选择：

ngOnInit() {
    for(var i = 0; i < this.checks.length; i++){
        var append = this.checks[i];
        $('#dropdown-list').append('<option>'+ append.name +'</option>');
    }

这是因为 ngFor 在这里不起作用.. 但在这种情况下，这不是我的问题。

有人可以帮我记录选中的options = [(ngModel)]="selectObject"

Answer 1

目前似乎还不支持多选，见https://github.com/angular/angular/issues/4427。

这是一种解决方法（不使用查询选择器）：

@Component({
  selector: 'my-app',
  template: `{{title}}<p>
  <select multiple="multiple" (change)="change($event.target.options)">
    <option *ngFor="#item of items">{{item}}</option>
  </select>
  <p>{{selectedOptions | json}}`
})
export class AppComponent {
  title = "Angular 2 beta - multi select list";
  items = 'one two three'.split(' ');
  constructor() { console.clear(); }
  change(options) {
    this.selectedOptions = Array.apply(null,options)  // convert to real array
      .filter(option => option.selected)
      .map(option => option.value)
  }
}

Plunker