Ember 数据绑定

正如其他的框架一样，Ember也有它特有的数据绑定方式，并且可以在任何一个对象上使用绑定。而然，数据绑定大多数情况都是使用在Ember框架本身，对于开发者最好还是使用计算属性更为简单方便。

双向绑定

// 双向绑定
Wife = Ember.Object.extend({  
  householdIncome: 800
});
var wife = Wife.create();
 
Hasband = Ember.Object.extend({  
  //  使用 alias方法实现绑定
  householdIncome: Ember.computed.alias('wife.householdIncome')
});
 
hasband = Hasband.create({  
  wife: wife
});
 
console.log('householdIncome = ' + hasband.get('householdIncome'));  //  output > 800  
// 可以双向设置值
 
//  在wife方设置值
wife.set('householdIncome', 1000);  
console.log('householdIncome = ' + hasband.get('householdIncome'));  // output > 1000  
// 在hasband方设置值
hasband.set('householdIncome', 10);  
console.log('wife householdIncome = ' + wife.get('householdIncome'));  

需要注意的是绑定并不会立刻更新对应的值，Ember会等待直到程序代码完成运行完成并且是在同步改变之前，所以你可以多次改变计算属性的值。由于绑定是很短暂的所以也不需要担心开销问题。

单向绑定

单向绑定只会在一个方向上传播变化。相对双向绑定来说，单向绑定做了性能优化，对于双向绑定来说如果你只是在一个方向上设置关联其实就是一个单向绑定。

var user = Ember.Object.create({  
  fullName: 'Kara Gates'
});
 
UserComponent = Ember.Component.extend({  
  userName: Ember.computed.oneWay('user.fullName')
});
 
userComponent = UserComponent.create({  
  user: user
});
 
console.log('fullName = ' + user.get('fullName'));  
// 从user可以设置
user.set('fullName', "krang Gates");  
console.log('component>> ' + userComponent.get('userName'));  
// UserComponent 设置值，user并不能获取，因为是单向的绑定
userComponent.set('fullName', "ubuntuvim");  
console.log('user >>> ' + user.get('fullName'));  

关于数据绑定的知识点不多，相对来说不是重点，毕竟对象之间的关联关系是越少、越简单越好。关联关系多了反而难以维护。

转载本站内容时，请务必注明来自W3xue，违者必究。