15

A. そのコンポーネントのコンストラクター B. そのコンポーネントのテンプレート内のコンポーネントのプロパティを参照したいと思います。これに関するAPIは少しシフトしているようですが、次のように動作することを期待しています:

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

プランカー

私は何を間違っていますか？

4

3 に答える 3

5

私は Angular2 を試していて、同じ問題に遭遇しました。ただし、現在のアルファ版 (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);

渡された Class のプロパティbootstrapは無視されているようです。これが意図したものなのかバグなのかは不明です。

編集: ソースから Angular2 をビルドし、注釈を試しまし@Attributeた。ドキュメントに従って動作します (ただし、ネストされたコンポーネントでのみ)。

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

「マット」をコンソールに出力します。

于 2015-05-02T09:43:36.040 に答える
4

現在の方法は、プロパティを @Input として装飾することです。

@Component({
    `enter code here`selector: 'bank-account',
    template: `
    Bank Name: {{bankName}}
    Account Id: {{id}}
    `
})
class BankAccount {
    @Input() bankName: string;
    @Input('account-id') id: string;
    // this property is not bound, and won't be automatically updated by Angular
    normalizedBankName: string;
}
@Component({
    selector: 'app',
    template: `
    <bank-account bank-name="RBC" account-id="4747"></bank-account>`,
    directives: [BankAccount]
})
class App {}
bootstrap(App);

上記の例はhttps://angular.io/docs/ts/latest/api/core/Input-var.htmlからのものです

于 2016-06-04T05:16:21.930 に答える