Angular 2 JSONオブジェクトを表示

Question

私はオブジェクトをPromiseで返しています。

私のオブジェクトは、そのように構成されています。私のサービスで

display_cart: ShoppingCart; 

constructor(private _shoppingCartService: ShoppingCartService) {} 

getShoppingCart() { 
    this._shoppingCartService.getShoppingCart().then(display_cart => this.display_cart = display_cart); 
    // this.display_cart = this._shoppingCartService.getShoppingCart(); 
} 
ngOnInit(){ 
    this.getShoppingCart(); 
} 

私は、データを取得するために、これを使用しています：

export class ShoppingCart { 
Cart_Items: [ 
    { 
     Id: number, 
     SKU: string, 
     Link: string, 
     ImageURL: string, 
     Title: string, 
     Description: string, 
     Qty: number, 
     Unit_Wt: number, 
     Unit_Price: number, 
     Sub_Total: number, 
     Sub_Wt_Total: number, 
     IsTaxExempt: boolean 
    } 
    ]; 
Shipping_Cost: number; 
Taxes: number; 
Discount: number; 
Sub_Total: number; 
Total_Wt: number; 
Total: number; 

}

私はコンポーネントクラスでこれを使用しています：

getShoppingCart() { 
    return Promise.resolve(DISPLAY_CART); 
} 

自分のデータを表示するために使用できるのは、{{display_cart | json}}しかし、それは単に私のjsonを返します。どのようにして値を抽出して、Cart_Itemsをループ内に表示し、その他の変数を必要な場所に表示するのですか？

Answer 1

あなたはそのような何か使用することができます

display_cart: ShoppingCart; 

constructor(private _shoppingCartService: ShoppingCartService) {} 

getShoppingCart() { 
    this._shoppingCartService.getShoppingCart().then(
    display_cart => { 
     this.display_cart = display_cart; 
     this.items = display_cart.Cart_Items ; 
    }); 
} 

ngOnInit(){ 
    this.getShoppingCart(); 
} 

を、対応するテンプレート内の項目を使用します。

<li *ngFor="#item of items"> 
    {{item.title}} 
</li>