以编程方式在 angular5 ng-select 中设置选定的值 [英] set selected value in angular5 ng-select programmaticaly

查看:26
本文介绍了以编程方式在 angular5 ng-select 中设置选定的值的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用 angular5 ng-select 组件:https://github.com/ng-select/ng-select并尝试在容器组件首次加载时设置选定值(以编程方式)(模型中设置的默认选定值).我没有找到它的任何相关属性,也没有找到每个项目的 isSelected 相关属性.这是我的代码(已过滤):HTML:

I'm using angular5 ng-select component: https://github.com/ng-select/ng-select and try to set the selected value (programatically) when the container component first loaded (kind of default selected value set in the model). I didn't find any relevant attribute for it or for the isSelected for each item. Here is my code (filtered): HTML:

<ng-select [items]="filter.values"  bindLabel="text" bindValue="id" class="input-md" [(ngModel)]="filter.selectedValue"></ng-select>

型号:

export class FilterData
{
    Name : string;
    FormattedName : string;
    values : Filter[];
    selectedValue : Filter = null;
    constructor(filterData : FilterData)
    {
        this.Name = filterData.Name;
        this.values = filterData.values;
        this.selectedValue = typeof filterData.selectedValue == "undefined" ? null : filterData.selectedValue;
    }
}

export class Filter 
{
    public id: number;
    public text: string;
}

推荐答案

只需找到项目

    let item = this.ngSelect.itemsList.findByLabel('label of the item');

然后重新设置

    this.ngSelect.select(item);

你需要在你的角度组件中引用 ng-select

you need a reference to ng-select in your angular component

    @ViewChild(NgSelectComponent)
    ngSelect: NgSelectComponent;

这篇关于以编程方式在 angular5 ng-select 中设置选定的值的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆