我学习角度2和我有一个问题.
实际上,我将每个组件属性传递给模板,如下所示：
import {Component,bootstrap,NgFor,NgModel} from 'angular2/angular2';
import {TodoItem} from '../item/todoItem';
@Component({
selector: 'todo-list',providers: [],templateUrl: 'app/todo/list/todoList.html',directives: [NgFor,TodoItem,NgModel],pipes: [],styleUrls:['app/todo/list/todoList.css']
})
export class TodoList {
list:Array<Object>;
constructor(){
this.list = [
{title:"Text 1",state:false},{title:"Text 2",state:true}
];
}
}
<todo-item [title]="item.title" [state]="item.state" *ng-for="#item of list"></todo-item>
import {Component,Input} from 'angular2/angular2';
@Component({
selector: 'todo-item',templateUrl: 'app/todo/item/todoItem.html',directives: [],styleUrls:['app/todo/item/todoItem.css']
})
export class TodoItem {
@input()
title:String;
@input()
state:Boolean;
}
我想知道我是否可以通过传递每个属性直接传递完整的对象内的模板？
<todo-item [fullObj]="item" *ng-for="#item of list"></todo-item>
解决方法
是的,将整个对象作为属性传递是完全正确的.
语法相同,所以只需为整个对象创建一个属性.
@Component({
selector: 'my-component'
})
export class MyComponent{
@input() item;
}
<my-component [item]=item></my-component>
这是一个例子：http://www.syntaxsuccess.com/viewarticle/recursive-treeview-in-angular-2.0