1

AngularJs 1.5 コンポーネントを使用しようとしていますが、宣言するたびにbindings次のエラーが発生します。

ディレクティブ 'homeComp' で使用される属性 'message' の式 'undefined' は割り当てられません!

私は単純なコンポーネントを試しています。それを学ぶためだけに、これはコードです:

var component = {
  bindings: {
      message: '='
  },
  controllerAs: 'vm',
  controller: function MainController() {
    this.message = 'Welcome to my component';

    function debug() {
      this.message = 'This message changed';
    }
    this.debug = debug;
  },
  template: [
    'Message: {{ vm.message }}<br />',
    '<button ng-click="vm.debug()">Change message</button>'
  ].join(``)
};

ここでエラーを確認できます: http://plnkr.co/edit/uutk5kxOVpa5eLfjoa8U?p=preview

コードの何が問題になっていますか? または、このエラーの原因は何ですか? バインディングを削除すると、エラーは表示されず、メッセージを変更できます。

4

2 に答える 2

5

binding参照されているプロパティがコンポーネント自体によってのみ使用される場合、コンポーネントでオプション を使用する必要はありません。

プロパティでを使用bindingすることにより、パラメータが双方向バインディングであること、つまり親HTML で設定され、プロパティへの変更が HTML に書き戻されることをディレクティブに具体的に伝えます。タグにはプロパティがないため、HTML は割り当てられません (書き戻すことはできません)。=messagemessage<home-comp>message

このエラーを修正するには、次の 3 つの方法があります。

  1. 要件<home-comp message="default message">を適用し、常に HTML でプロパティを提供してください。
  2. bindingを使用して、 をオプションとして定義しmessage: '=?'ます。プランカー
  3. HTML から設定する予定がない場合は、messageプロパティを から完全に削除します。binding

ドキュメントからの詳細情報。

于 2016-05-14T16:26:20.057 に答える