將數據傳遞給組件angular2

試圖將數據傳遞給子組件，我可以將屬性附加到模板中，但似乎無法訪問組件類中的id。有任何想法嗎？將數據傳遞給組件angular2

---家長---

<related-products [id]="product.id"></related-products>

--CHILD ---

import {Component, OnInit, Input} from 'angular2/core'; 
import {RouteParams, Router} from 'angular2/router'; 
import {ProductService} from '../products/product.service.js'; 

@Component({ 
    selector: 'related-products', 
    templateUrl: "wp-content/themes/f2/app/views/directives/related-products-template.html", 
    inputs: ['id'], 
    providers: [ProductService] 
}) 
export class RelatedProductsComponent implements OnInit { 

    products: any[]; 
    errorMessage: string; 
    id: number; 

    constructor(
    private _service: ProductService, 
    private _router: Router, 
    private _routeParams: RouteParams 
) {} 

    ngOnInit() { 

    console.log(this.id); 
    } 

}

來源

2016-04-26 user3355603

你可以嘗試使用@Input爲id屬性：

export class RelatedProductsComponent implements OnInit { 
    products: any[]; 
    errorMessage: string; 
    @Input() // <------------ 
    id: number; 

    (...) 
}

但它應該與inputs屬性一起使用，並且您應該有權訪問ngOnInit鉤子方法。你確定提供的表達式product.id返回定義的內容嗎？

看到這個plunkr：https://plnkr.co/edit/aG4TdHbAls3cu04AAt64?p=preview。

來源

2016-04-26 13:08:38

我認爲它的事實是，我正在做一個Ajax調用來獲取數據，而這個inturn意味着數據還沒有準備好在子組件中。我如何等待構建子組件，以便知道數據可用 – user3355603

您直接獲得產品還是循環內的元素？ –

它的單個詳細頁面，所以我打電話，並獲取數據，我有孩子組件（相關產品（需要從父組件（產品詳細信息）的ID – user3355603

將數據傳遞給組件angular2

回答

相關問題