[英]Angular 2 alpha 22, How to pass down a value to a component through attributes?
我用选择器'app'声明了一个组件,然后像下面这样使用它:
<app title="Awesome Title"></app>
在模板中,我这样写:
The title passed {{ title }}
我确实添加了编写组件注释:
@Component({
selector: 'app',
properties: {title:'title'} // also tried ['title']
});
但是什么都没有显示,输出是
The title passed
有什么帮助吗? 谢谢
在撰写本文时,最新版本是alpha.26。 属性定义略有变化,因此这是新语法
@Component({
selector: 'app',
properties: ['title:title']
});
<div [title]="Some Title"></div>
我已经开始撰写一系列博客文章来演示Angular 2概念。 在这里查看:
http://www.syntaxsuccess.com/viewarticle/angular-2.0-examples
我有一个工作示例,说明如何通过属性将属性分配给组件。 查看树视图示例,因为它使用率很高。
由于某些原因, properties
似乎在引导的根应用程序上不起作用。
尝试创建一个名为“ title-app”的组件,并将其加载到“ app”内部。
// inner component
@Component({
selector: 'title-component',
properties: {title:'title'}
})
@View({ template: '<h1>{{title}}</h1>'})
class titleComponent{}
// root app
@Component({ selector: 'app' })
@View({
directives: titleComponent,
template: '<title-component [title]="Some Title"></title-component>'
})
class App{}
您可能还想使用Angular2的最新版本:当前为alpha-26 。 从alpha-26 +起,如果您的媒体资源是相同的名称,则只需调用一次即可。
properties: {'title': 'title'}
=> properties: 'title'
正确的方法是:
import {
ComponentAnnotation as Component,
ViewAnnotation as View, bootstrap
} from 'angular2/angular2';
import {Attribute} from 'angular2/src/core/annotations_impl/di';
@Component({
selector: 'app'
})
@View({
template: '{{goofy}} stuff'
})
class App {
goofy:string;
constructor(@Attribute('goofy') goofy:string) {
this.goofy = goofy;
}
}
bootstrap(App);
在此处查看完整的Plunker http://plnkr.co/edit/n2XWez69HNJbixH3tEmR?p=preview
但是,这目前已被破解,是一个已知问题https://github.com/angular/angular/issues/1858
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.