标签:
Besides @Input(), we can also use properties on the @Component, to pass the data.
import {Component, View, NgFor, Input} from ‘angular2/angular2‘; @Component({ selector: ‘reddit-article‘ }) @View({ directives: [], template: ` <article> <div class="votes">{{article.votes}}</div> <div class="main"> <h2> <a href="{{article.link}}">{{article.title}}</a> <span>({{ article.domain() }})</span> </h2> <ul> <li><a href (click)="article.voteUp()">Up</a></li> <li><a href (click)="article.voteDown()">Down</a></li> </ul> </div> </article> ` }) export class RedditArticle { @Input() article: Article; voteUp() { this.article.voteUp(); return false; } voteDown() { this.article.voteDown(); return false; } }
Works the same as:
import {Component, View, NgFor, Input} from ‘angular2/angular2‘; @Component({ selector: ‘reddit-article‘, properties: [‘article‘] }) @View({ directives: [], template: ` <article> <div class="votes">{{article.votes}}</div> <div class="main"> <h2> <a href="{{article.link}}">{{article.title}}</a> <span>({{ article.domain() }})</span> </h2> <ul> <li><a href (click)="article.voteUp()">Up</a></li> <li><a href (click)="article.voteDown()">Down</a></li> </ul> </div> </article> ` }) export class RedditArticle { article: Article; voteUp() { this.article.voteUp(); return false; } voteDown() { this.article.voteDown(); return false; }
[Angular 2] Passing data to components with 'properties'
标签:
原文地址:http://www.cnblogs.com/Answer1215/p/4929130.html