EmberJS - 繫結

繫結是 Ember.js 中一項強大的功能，可幫助在兩個屬性之間建立一條連結，並且當其中的一個屬性發生改變後，另一個屬性會自動更新。還可以繫結同一個物件或不同的物件。

語法

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

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

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

語法描述了兩個屬性ClassName1 和ClassName2 的繫結，如果ClassName2 已更新，將反映在ClassName1 中。

示例

以下示例在兩個屬性之間建立連結，並當一個屬性發生改變時更新另一個屬性 −

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 伺服器，將獲得以下輸出 −

透過使用單向繫結（在本 連結 中進行了解釋）來執行物件模型綁定向單方向傳播更改。