将数据传递到组件angular2

Question

尝试将数据传递给子组件时，我可以将属性附加到模板中，但是似乎无法访问组件类内部的ID。 有任何想法吗？

---家长---

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

- 儿童 - -

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

}

Answer 1

您可以尝试将@Input用作id属性：

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

  (...)
}

但它应该与inputs属性一起使用，并且您应该可以访问ngOnInit挂钩方法中的值。 您确定提供的表达式product.id返回定义的值吗？

请参阅以下代码： https ://plnkr.co/edit/aG4TdHbAls3cu04AAt64 ? p = preview。