Mat-选择输入组合对象
Mat-选择输入组合对象
提问于 2021-02-22 12:31:03
我正在努力将一个组合的值输入到select中。假设我们的对象只包含一个ID和一个名称，进行工作选择的一个常见方法是这样做：
<mat-form-field>
<mat-label>Placeholder</mat-label>
<mat-select>
<mat-option *ngFor="let i of fooCollection" [value]="i.id">
{{i.name}}
</mat-option>
</mat-select>
</mat-form-field>现在，为了提供一个值，我找到了文档中的这个工作示例，它简单地将一个[(value)]选项添加到mat-select标记中，但是由于这里有一个组合对象，所以它不工作。
知道怎么解决这个问题吗？非常感谢！凯夫‘
回答 1
Stack Overflow用户
回答已采纳
发布于 2021-02-22 12:53:54
看看这个:打字本：
/** @title Select with 2-way value binding */
@Component({
selector: 'select-value-binding-example',
templateUrl: 'select-value-binding-example.html',
})
export class SelectValueBindingExample {
myOptions = [
new MyOptions('name1','description1' ),
new MyOptions('name2','description2' ),
new MyOptions('name3','description3' ),
]
selectedOption = this.myOptions[2]
}//Cls
//-----------------------------------------------------//
class MyOptions{
constructor(
public name:string,
public description:string
){}
}Html：
<mat-form-field appearance="fill">
<mat-label>Select an option</mat-label>
<mat-select [(value)]="selectedOption">
<mat-option *ngFor="let myOption of myOptions" [value]="myOption">
{{myOption.description}}
</mat-option>
</mat-select>
</mat-form-field>
<p>You selected: {{selectedOption|json}}</p>当您添加行<mat-select [(value)]="selectedOptionName">时，它将“收集”任何值进入该行<mat-option *ngFor="let myOption of myOptions" [value]="actualValueGoesHere">中的值。你可以随心所欲地使用这个价值。
要设置初始值，只需设置selectedOption = this.myOptions2
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/66315774
复制相关文章
相似问题
腾讯云开发者
