Question

我正在使用ng2-select，似乎无法找到解决方法。

GetCountriesWithNameAndID(){
    this.countryService.GetCountriesWithNameAndID()
        .subscribe((res: ICountry[]) => {
            this._countries = res;
            this._countries.forEach((country: ICountry) => {
                //console.log(country.CountryID + "===========================" + country.CountryName);
                this.items.push(country.CountryName);
                //this.items.push({
                //    id: country.CountryID,
                //    text:country.CountryName
                //})
                this.select.itemObjects.push(new SelectItem({ id: country.CountryID, text: country.CountryName }));

            })

        })
}

我发现了一个类似问题here，并尝试按照回复但卡住了

Answer 1

import { SelectItem } from 'ng2-select/components/select/select-item';

Answer 2

我绕过了使用＆＃34; SelectItem＆＃34;对象由于某种原因。不确定ng2-bootstrap实现中是否存在错误，对象未导出或任何其他冲突

所以我解决了这个问题，如下面的代码片段所示，封装了ng2-select功能，它显示了获取远程数据并准备它们以便在select中显示的相关方法。

import { Component, Input, Output, EventEmitter, ViewChild} from '@angular/core';
import { SelectComponent } from 'ng2-select';
import { Observable } from 'rxjs/Rx';

@Component({
    selector: 'my-select',
    template:  `<ng-select
                    (active)="selected_item"
                    [allowClear] = "allowClear"
                    [items] = "myRecords"
                    [disabled] = "disabled"
                    (data) = "refreshValue($event)"
                    (selected) = "selected($event)"
                    (removed) = "removed($event)"
                    (typed) = "typed($event)"
                    placeholder = "{{placeholder}}">
                </ng-select>`
})

export class mySelect {
    constructor() {}

    myRecords: any[];    
    mySelectItems: any[];
    ....
    // get Items for select
    getItems(searchstring: string) {
        var self = this;

        // fetch items from remote datasource  
        this.dataService.getRecords(this.webapi_data, this.pageno, this.pagesize, this.sortcolumn, this.data_filter, null, null)
            .subscribe((data: any[]) => {
                var response: any = data;
                var myrecs = response.items;

                // prepare fetched data for ng2-select datastructure and assign to bound array
                this.myRecords = this.getData(myrecs);
            },
            error => {
                console.log("MySelect: " + error);
            });
    }

    // convert fetched to ng2-select datastructure
    getData(data: any): any {
        this.mySelectItems = [];
        try {
            for (let entry of data) {
                var t: Object = {};
                t['id'] = entry[this.valuefield];
                t['text'] = entry[this.textfield];
                this.mySelectItems.push(t);
            }
        } catch (e) {
            console.log('my Select fill box:' + e);
        }
        return this.mySelectItems;
    }
    ....
}

Answer 3

我使用＆＃34; SelectItem＆＃34;重新启动了Visual Studio。导入语句和一切就绪，问题就消失了。

ng2-select生成错误找不到名称SelectItem

3 个答案: