Arrays 使用Angular2中的接口将对象推入新数组

我正在从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);
    }

}

我的组件：

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);
    }

}

从'angular2/core'导入{Component，OnInit，DoCheck}；
从“/../interfaces/interfaces.ts”导入{Item}；
从“/../services/item.service.ts”导入{ItemService}；
@组成部分({
模板：`
添加项


{{item.name}


`
})
导出类AddTradeComponent实现OnInit{
公共项目：项目[]；
公共选择项：项[]；
构造函数（私有_itemService:itemService）{}
getUserItems（）{
this.\u itemService.getUserItems（）。然后（userItems=>this.items=userItems）；
}
恩戈尼尼特（）{
这是getUserItems（）；
}
onSelect（项目）{
console.log（'items'，item）；
此项。选择编辑项。推送（项）；
}
}

我收到的错误：

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”

---

记录对象工作正常，我只是无法将其推到这个位置。请选择EdItems。

您没有初始化数组。在声明成员变量时初始化数组：

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

或者在构造函数中初始化它们：

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

---

这是因为您尚未初始化属性。只需将其更改为

publicselecteditems:Item[]=[]哇，老兄，这么简单啊。非常感谢！不过还是有个简单的问题。虽然填充items数组很有效，但也没有初始化。这是怎么回事？