绑定到angular2组件属性 [英] Binding to a component property in angular2

问题描述

我想A.内的组件上引用属性，组件的构造B.该组件的模板。关于这个API的似乎是移一点点，但是我希望以下工作：

I'd like to reference a property on a component within A. that' component's constructor B. that component's template. The apis on this seem to be shifting a little bit, but i'd expect the following to work:

<my-component [greeting]="hello"></my-component>

结果

// 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
  }
}

Plunkr

Plunkr

我在做什么错了？

推荐答案

我和Angular2试验和碰到了同样的问题。
然而，我发现以下与当前alpha版本的工作（2.0.0-alpha.21）

I was experimenting with Angular2 and came up against the same problem. However, I found the following to work with the current alpha version (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);

似乎在传递给引导类的属性被忽略。不能确定这是否是有意或错误。

It seems that properties on the Class that is passed to bootstrap are ignored. Unsure if this is intended or a bug.

编辑：我刚刚建立Angular2从源代码，并试图在 @Attribute 标注，它的工作原理是按照文档（但仅限于嵌套组件）

I've just built Angular2 from source and tried the @Attribute annotation, it works as per the docs (but only on the nested component).

constructor(@Attribute('name') name:string) { 
    console.log(name);
};

打印马特到控制台。

Prints 'Matt' to the console.

这篇关于绑定到angular2组件属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！