我应该如何使用angular2-app的angular2-material设计中的select tag下拉列表

时间:2016-08-05 12:08:14

标签: angular angular-cli angular-material2

我正在使用@angular2-materail组件来构建我的应用程序并格式化表单输入元素。我正在使用md-inputmd-checkbox等,但未找到任何组件来显示选择下拉列表。是否有任何组件可用于格式化select下拉列表?

2 个答案:

答案 0 :(得分:0)

据我所知,有一个md-select正在开发中,它还没有。但您可以跟踪此问题的当前进展:angular2-material issue 118

答案 1 :(得分:0)

这是

//Your component

import {Component} from '@angular/core';


@Component({
  selector: 'select-form-example',
  templateUrl: 'select-form-example.html',
})
export class SelectFormExample {
  selectedValue: string;

  foods = [
    {value: 'steak-0', viewValue: 'Steak'},
    {value: 'pizza-1', viewValue: 'Pizza'},
    {value: 'tacos-2', viewValue: 'Tacos'}
  ];
}
<form>
  <md-select placeholder="Favorite food" [(ngModel)]="selectedValue" name="food">
    <md-option *ngFor="let food of foods" [value]="food.value">
      {{food.viewValue}}
    </md-option>
  </md-select>

  <p> Selected value: {{selectedValue}} </p>
</form>