使用Angular2中的接口將對象推入新數組

Question

我從Angular2中的服務中檢索對象列表。

點擊后我想把我的ngFor中的對象放到一個新的數組上（使用相同的界面）。

我能夠很好地顯示列表中的項目。 我也能夠顯示我在控制台中選擇的項目，但是我無法將此對象推送到具有相同界面的新陣列中。

我的界面：

export interface Item {
    id: string,
    name: string,
    icon_url: string,
    exterior: string,
    type: string,
    tag: string,
    addedClass: string,
    selected: boolean
}

我的組件：

import {Component, OnInit, DoCheck} from 'angular2/core';
import {Item} from './../interfaces/interfaces.ts';
import {ItemService} from './../services/item.service.ts';


@Component({
    template: `
        <h2>Add item</h2>
        <div class="itemlist">
            <ul class="items">
                <li 
                    *ngFor="#item of items"
                    [class.selected]="item === selectedItem"
                    (click)="onSelect(item)"
                >
                    <span class="item">
                        {{item.name}}
                    </span>
                </li>
            </ul>
        </div>
    `
})

export class AddTradeComponent implements OnInit {

    public items: Item[];
    public selectedItems: Item[];


    constructor(private _itemService: ItemService) { }

    getUserItems() {
        this._itemService.getUserItems().then(userItems => this.items = userItems);

    }

    ngOnInit() {
        this.getUserItems();
    }

    onSelect(item) {
        console.log('items ', item);
        this.selectedItems.push(item);
    }

}

我得到的錯誤：

評估“點擊”時出錯

TypeError：無法讀取未定義的屬性“push”

記錄對象工作正常，我只是無法將其推送到this.selectedItems。

Answer 1

您沒有初始化陣列。 在聲明成員變量時初始化數組：

public items: Item[] = [];
public selectedItems: Item[] = [];

或者在構造函數中初始化它們：

constructor() {
    this.items = [];
    this.selectedItems = [];
}