当前位置:  开发笔记 > 前端 > 正文

如何在角度2材料设计中设置md-select组件的默认值?

如何解决《如何在角度2材料设计中设置md-select组件的默认值?》经验,为你挑选了1个好方法。

我有以下select组件,它来自rest api的数据.如何在md-select上设置默认选择值?

  
          {{warehouse.description}}
        

Madhu Ranjan.. 20

你可以尝试下面,

组件HTML

  
    
      {{food.viewValue}}
    
  

  

Selected value: {{selectedValue}}

组件脚本

@Component({
  selector: 'select-form-example',
  templateUrl: './select-form-example.html',
})
export class SelectFormExample {
  foods = [
    {value: 'steak-0', viewValue: 'Steak'},
    {value: 'pizza-1', viewValue: 'Pizza'},
    {value: 'tacos-2', viewValue: 'Tacos'}
  ];


   // setting this is the key to initial select.
   selectedValue: string = this.foods[0].value;
}

这里的关键是设置selectedValue初始值.

检查这个StackBlitz.

希望这可以帮助!!



1> Madhu Ranjan..:

你可以尝试下面,

组件HTML

  
    
      {{food.viewValue}}
    
  

  

Selected value: {{selectedValue}}

组件脚本

@Component({
  selector: 'select-form-example',
  templateUrl: './select-form-example.html',
})
export class SelectFormExample {
  foods = [
    {value: 'steak-0', viewValue: 'Steak'},
    {value: 'pizza-1', viewValue: 'Pizza'},
    {value: 'tacos-2', viewValue: 'Tacos'}
  ];


   // setting this is the key to initial select.
   selectedValue: string = this.foods[0].value;
}

这里的关键是设置selectedValue初始值.

检查这个StackBlitz.

希望这可以帮助!!

推荐阅读
黄晓敏3023
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有