Question

我试图将数组传递给组件，作为其输入：

<history [model]="history"></history>

我的组件是：

import {Component} from 'angular2/core';
import {HistoryCmp} from '../history/history';
import {Router, ROUTER_DIRECTIVES, RouteConfig, RouteData} from 'angular2/router';

@Component({
  selector: 'home',
  templateUrl: './components/home/home.html',
  styleUrls: ['./components/home/home.css'],
  directives: [ROUTER_DIRECTIVES]
})
export class HomeCmp {
  history: any;
  constructor(routeData: RouteData) {
    this.history = routeData.data;//this is an array of objects: [obj1, obj2 ....]
  }
}

我的历史成分：

import {Component, Input} from 'angular2/core';

@Component({
  selector: 'history',
  templateUrl: './components/history/history.html',
  styleUrls: ['./components/history/history.css']
  //directives: [ROUTER_DIRECTIVES]
})
export class HistoryCmp {
  @Input() model;
  constructor() {
    //
  }
}

及其模板：

<div class="history">
  <li *ngFor="#item of model">{{item.name}}</li>
</div>

我收到以下错误：

异常：模板解析错误：无法绑定到＆＃39; model＆＃39;因为它不是   一个已知的本土财产（＆＃34;       ] [模型] =＆＃34;历史＆＃34;＆GT;

＆＃34;）：HomeCmp @ 1:13

我做错了什么？

修改

解决方案：我忘了添加指令依赖：

directives: [ROUTER_DIRECTIVES, HistoryCmp]

谢谢，参见Yaniv

将数组作为Component的输入传递时出错

0 个答案: