绑定到angular2中的组件属性

Nic*_*lin 15 javascript ecmascript-6 angular

我想在A中的组件上引用一个属性'组件的构造函数B.该组件的模板.这方面的apis似乎有点变化,但我希望以下工作:

<my-component [greeting]="hello"></my-component>
Run Code Online (Sandbox Code Playgroud)


// my component.es6.js
@Component({
  selector: 'my-component',
  properties: {
   'greeting': 'greeting'
  }
})
@View({
  template: '{{greeting}} world!'
})
class App {
  constructor() {
    console.log(this.properties) // just a guess
  }
}
Run Code Online (Sandbox Code Playgroud)

Plunkr

我究竟做错了什么?

Mat*_*kay 5

我正在试验Angular2并遇到了同样的问题.但是,我发现以下内容可以使用当前的alpha版本(2.0.0-alpha.21)

@Component({
  selector: 'hello',
  properties: {'name':'name'}
})
@View({
  template:`<h1>Hello {{_name}}</h1>`
})
class Hello {
  _name: string;

  constructor() { 
    console.log(this);
  };

  set name(name){
    this._name = name;
  }
}

@Component({
  selector: 'app',
})
@View({
  template:
  `
    <div>
      <hello name="Matt"></hello>
    </div>
  `,
  directives: [Hello]
})
class Application {
  constructor() { };
}

bootstrap(Application);
Run Code Online (Sandbox Code Playgroud)

似乎bootstrap忽略了传递给Class的属性.不确定这是故意还是错误.

编辑:我刚刚从源代码构建了Angular2并尝试了@Attribute注释,它按照文档工作(但仅限于嵌套组件).

constructor(@Attribute('name') name:string) { 
    console.log(name);
};
Run Code Online (Sandbox Code Playgroud)

将'Matt'打印到控制台.