Emberjs-obj-mod-bindings

提供:Dev Guides
移動先:案内検索

EmberJS-バインディング

バインディングはEmber.jsの強力な機能であり、2つのプロパティ間のリンクを作成するのに役立ち、プロパティの1つが変更されると、もう1つが自動的に更新されます。 同じオブジェクトまたは異なるオブジェクトをバインドすることもできます。

構文

ClassName1 = Ember.Object.create ({
  //code here
});

ClassName2 = Ember.Object.extend ({
  //code here
});

ClassName3 = ClassName2.create ({
  //code here
});

この構文は、2つのプロパティ_ClassName1_および_ClassName2_のバインドについて説明しています。 _ClassName2_が更新されると、_ClassName1_に反映されます。

次の例では、2つのプロパティ間のリンクを作成し、別のプロパティが変更されたときに1つのプロパティを更新します-

import Ember from 'ember';

export default function() {
   var CarOne = Ember.Object.create ({
     //primary value
      TotalPrice: 860600
   });

   var Car = Ember.Object.extend ({
     //creates property which is an alias for another property
      TotalPrice: Ember.computed.alias('CarOne.TotalPrice')
   });

   var CarTwo = Car.create ({
      CarOne: CarOne
   });
   document.write('Value of car before updating: ' + CarTwo.get('TotalPrice'));

  //sets the car price
   CarTwo.set('TotalPrice', 930000);

  //above car price effects the CarOne
   document.write('<br>Value of car after updating: ' + CarOne.get('TotalPrice'));
}

今_app.js_ファイルを開き、ファイルの先頭に次の行を追加します-

import objectmodelbindings from './objectmodelbindings';

ここで、 objectmodelbindings は、「objectmodelbindings.js」として指定され、「app」フォルダーの下に作成されるファイルの名前です。

次に、エクスポートの前に、下部の継承された「objectmodelbindings」を呼び出します。 _objectmodelbindings.js_ファイルに作成されたobjectmodelbindings関数を実行します-

objectmodelbindings();

出力

エンバーサーバーを実行すると、次の出力が得られます-

Ember.jsオブジェクトモデルバインディング

オブジェクトモデルバインディングは、このリンク:/emberjs/objectmodel_onewaybinding [link]で説明されている一方向バインディングを使用して、変更を一方向に伝播します。