Emberjs 1.x-pre Ember.Router和Ember.computed问题

Question

我正在阅读http://code418.com/blog/2012/03/26/advanced-emberjs-bindings/并且碰到了Ember .Binding.and用于变换，在当前的emberjs中已弃用Ember.computed。我决定更新旧的emberjs 0.9.x小提琴http://jsfiddle.net/Wjtcj/与emberjs 1.x一起工作，并提供了一个Ember.computed.and和新的小提琴http：// jsfiddle .net/Wjtcj/5/。虽然它的作品，我不能让它返回thesame输出作为旧但当代码http://jsfiddle.net/Wjtcj/28/的改进版本失败

STATEMANAGER: Sending event 'navigateAway' to state root. 
STATEMANAGER: Sending event 'unroutePath' to state root. 
STATEMANAGER: Sending event 'routePath' to state root. 
STATEMANAGER: Entering root.index 
<error> 

看来setSync函数是问题，并失败，因为我打电话给它的计算属性。

The handlebars template: 

<script type="text/x-handlebars" data-template-name="application" > 

{{outlet}} 
</script> 


<script type="text/x-handlebars" data-template-name="obj" > 
{{#each App.ObjController}} 
    <p>{{this}}</p> 
{{/each}} 
</script>​ 

更新，请使用此链接，更新的代码http://jsfiddle.net/Wjtcj/28/。下面没有更多的代码适用

App = Ember.Application.create(); 

    Ember.computed.and = function(dependentKey, otherKey) {  
    return Ember.computed(dependentKey, otherKey, function(key) { 
    return get(this, dependentKey) && get(this, otherKey);  
    }); 
    }; 


Ember.computed.or = function(dependentKey, otherKey) {  
    return Ember.computed(dependentKey, otherKey, function(key) { 
    return get(this, dependentKey) || get(this, otherKey);  
    }); 
}; 


App.ApplicationController = Em.Controller.extend(); 

App.ApplicationView = Ember.View.extend({ 
    templateName: 'application' 
}); 


App.ObjView = Em.View.extend({ 
    templateName: 'obj' 
}); 

App.ObjController = Ember.ArrayController.extend({ 
    content: [], 
    user: Ember.Object.create({isAdmin: false, isOwner: false}), 

    isSelected: false, 
    isSaveEnabled: false, 
    canRead: false, 
    isSaveEnabledBinding: Ember.computed.and('user.isAdmin', 'isSelected'), 
    canReadBinding: Ember.computed.or('user.isAdmin', 'user.isOwner'), 
    setSync: function(property, value) { 
    this.set(property, value); 
    Ember.run.sync(); // synchronize bindings 
    this.pushObject('isSaveEnabled = %@ ; canRead = %@'.fmt(this.get('isSaveEnabled'),  this.get('canRead'))); 
    } 
    }); 

    App.ObjController.setSync('isSelected', false); 
    App.ObjController.setSync('user', Ember.Object.create({isAdmin: true, isOwner: false})); 
    App.ObjController.setSync('isSelected', true); 
    App.ObjController.setSync('user', Ember.Object.create({isAdmin: false, isOwner: true})); 
    App.ObjController.setSync('user', Ember.Object.create({isAdmin: false, isOwner: false})); 


App.Router = Ember.Router.extend({ 
    enableLogging: true, 
    location: 'hash', 
    root: Ember.Route.extend({ 
    index: Ember.Route.extend({ 
     route: '/', 
     connectOutlets: function(router) { 
     router.get('applicationController').connectOutlet('application'); 
     } 

     }), 

    obj: Ember.Route.extend({ 
     route: '/obj', 
     enter: function(router) { 
     console.log("The obj sub-state was entered."); 
     }, 

     index: Ember.Route.extend({ 
      route: '/', 
      connectOutlets: function(router, context) { 
       router.get('applicationController').connectOutlet('obj'); 
      } 
     }) 
    }) 
    }) 
}); 

感谢您的任何建议或修正。

Answer 1

许多事情在你的例子去错了，我不知道这将是所有的说明，但我觉得这是你想实现什么： http://jsfiddle.net/machty/Wjtcj/31/

要点

1. 很少有您需要手动调用Ember.run.sync（），除非您正在执行测试用例或其他异常情况。
2. 您试图在ObjController中填充太多东西。预期目的是显示用户及其权限列表;我采用了使用ArrayController管理用户列表的常见模式，然后用UserView显示每个用户。
3. 原来的<error>是因为试图将applicationController的插口连接到... applicationController，因此递归和堆栈溢出
4. 绑定和计算属性之间存在差异。如果您使用的计算性能，不要把“绑定”结束时你的财产

所以不是这样的：

isSaveEnabledBinding: Ember.computed.and('user.isAdmin', 'isSelected'), 
canReadBinding: Ember.computed.or('user.isAdmin', 'user.isOwner'), 

做这个

isSaveEnabled: Ember.computed.and('isAdmin', 'isSelected'), 
canRead: Ember.computed.or('isAdmin', 'isOwner'),