我有一个通过角度材料met-select创建的下拉列表,其中一个对象被填充。
这是我的对象
[
{Id: 0101, name: "324356667_INR_BOSTON_CITY"}
{Id: 0102, name: "324356667_INR_BOSTON_CITY"}
{Id: 0103, name: "324356667_USD_BOSTON_CITY"}
{Id: 0104, name: "424356688_USD_BOSTON_CITY"}
{Id: 0105, name: "224356699_INR_BOSTON_CITY"}
]
这是我遇到的选择下拉列表
<mat-form-field>
<mat-select
(change)="changeVal($event.value)"
placeholder="Projects"
[formControl]="toppings"
multiple required>
<mat-option
*ngFor="let p of nproj; let p = index;"
[value]="p" [class.pclass]="disabled">
{{p.name}}
</mat-option>
</mat-select>
</mat-form-field>
在我的CSS中,我这样写了
.pclass { 颜色:#ddd!important; }
以下是我的.ts文件
changeVal(pval) {
for (let p of pval) {
var pval_array = p.name.split("_");
}
for (let item of this.nproj) {
var res_array = item.name.split("_");
if (pval_array==res_array) {
this.disabled=false;
} else {
this.disabled=true;
}
}
要求是,如果有人从下拉列表中选择值,则_
之前的字符将与下拉项目的其余部分(_
之前的字符)进行比较
。如果匹配找到的项目将突出显示或休息将被禁用。
在我的示例中,如果我选择第一个下拉元素,则应禁用最后两个下拉元素。