массив dataItems, как отображать в виде, как JSON - PullRequest
Новая
       17

массив dataItems, как отображать в виде, как JSON

0 голосов
/ 10 июля 2019

У меня вопрос по поводу моего кода.

Из этого кода я показываю в консоли этот массив: 

 public country: Country[] = [];
  public _items: TokenModel[] = [];
   @ViewChild("autocomplete") autocomplete: RadAutoCompleteTextViewComponent;

   ngOnInit(): void {
        this.getallcountry();
    }
    getallcountry() {
        this.ws.getAllCountryws().subscribe(
            country => {
                this.country = country;
                const mycountry = country;
                console.log('mycountry', mycountry) // show correct JSON
                 for (let i = 0; i < mycountry.length; i++) {
                console.log(mycountry.length) // show correct
                     this._items.push(new TokenModel(mycountry[i].company_id, null));
                }
            },
            err => console.error('err', err),
            () => console.log('error')
        );
    }
get dataItems(): TokenModel[] {
    console.log('this._items', this._items)
    return this._items;
}

Показать в консоли: 

JS: this._items [Afghanistan, Albania, Algeria, American Samoa, Andorra, Angola, Anguilla, Antarctica, Antigua and Barbuda, Argentina, Armenia, Aruba, Australia, Austria, Azerbaijan, Bahamas, Bahrain, Bangladesh, Barbados, Belarus, Belgium, Belize, Benin, Bermuda, Bhutan, Bolivia, Bonaire, Bosnia and Herzegovina, Botswana, Bouvet Island, Brazil, British Indian Ocean Territory, Brunei Darussalam, Bulgaria, Burkina Faso, Burundi, Cambodia, Cameroon, Canada, Cape Verde, Cayman Islands, Central African Republic, Chad, Chile, China, Christmas Island, Cocos (Keeling) Islands, Colombia, Comoros, Congo, Democratic Republic of the Congo, Cook Islands, Costa Rica, Croatia, Cuba, Curaçao, Cyprus, Czech Republic, Cote d'Ivoire, Denmark, Djibouti, Dominica, Dominican Republic, Ecuador, Egypt, El Salvador, Equatorial Guinea, Eritrea, Estonia, Ethiopia, Falkland Islands (Malvinas), Faroe Islands, Fiji, Finland, France, French Guiana, French Polynesia, French Southern Territories, Gabon, Gambia, Georgia, Germany, Ghana, Gibra...

Из html я хочу отобразить в автозаполнении и написать этот код: 

<RadAutoCompleteTextView #autocomplete [items]="dataItems" suggestMode="Suggest"
                displayMode="Tokens" row="1" col='0' hint="Country">
                <SuggestionView tkAutoCompleteSuggestionView>
                    <ng-template tkSuggestionItemTemplate let-country="item">
                        <StackLayout orientation="vertical" padding="10">
                            <Label [text]="text"></Label>
                        </StackLayout>
                    </ng-template>
                </SuggestionView>
            </RadAutoCompleteTextView>

В поле зрения ничего не показано. Я думаю, что проблема в том, что результат в массиве, а не в JSON.

Можете ли вы предложить мне какую-либо идею, как показать в поле зрения страны?

Ответы [ 2 ]

0 голосов
/ 11 июля 2019

Вы должны использовать Observables для этого здесь обновленный код 

    public _items: ObservableArray<TokenModel>;

constructor(private service: ItemService) {
    this.getallcountry();
}

ngOnInit(): void {

}
getallcountry() {
    this._items = new ObservableArray<TokenModel>();
    let countries = this.service.getItems();
    for (let i = 0; i < countries.length; i++) {
        this._items.push(new TokenModel(countries[i].name, undefined));
    }
}
get dataItems(): ObservableArray<TokenModel> {
    //console.log('this._items', this._items)
    return this._items;
}

Также в вашем HTML 

<StackLayout backgroundColor="#66cdaa" padding="5">
<Label text="Select country"></Label>
<RadAutoCompleteTextView [items]="dataItems" suggestMode="Suggest"
    displayMode="Tokens">
    <SuggestionView tkAutoCompleteSuggestionView>
        <ng-template tkSuggestionItemTemplate let-item="item">
            <StackLayout orientation="vertical" padding="10">
                <Label [text]="item.text"></Label>
            </StackLayout>
        </ng-template>
    </SuggestionView>
</RadAutoCompleteTextView>

Это должно работать.

0 голосов
/ 10 июля 2019

Вы используете TokenModel по умолчанию, где единственными допустимыми атрибутами являются text и image. Но вы пытаетесь связать name в вашем шаблоне, который будет неопределенным.

Также похоже, что вы должны использовать ObservableArray в SuggestionView.

Обновленная игровая площадка

...