Question

我正在阅读 http://code418.com/blog/2012/03/26/advanced-emberjs-bindings/ 并遇到 Ember.Binding.and for transformation 在 Ember.computed 的当前版本中已弃用。我决定更新旧的emberjs 0.9.x小提琴 http://jsfiddle.net/Wjtcj/ 与emberjs 1.x合作，并提供了一个Ember.computed.and，如新小提琴所示 http://jsfiddle.net/Wjtcj/5/ 即可。虽然它有效，但我不能让它返回旧版本的输出但是当代码 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/

重点

除非您正在进行测试用例或其他一些异常情况，否则很少需要手动调用Ember.run.sync（）。
你试图在ObjController中塞满太多东西。目的是显示用户及其权限列表;我采用了使用ArrayController管理用户列表的常用模式，然后用UserView显示每个模式。
您的原始<error>是由于尝试将applicationController的出口连接到... applicationController，因此递归和堆栈溢出
绑定和计算属性之间存在差异。如果您正在使用计算属性，请不要将“绑定”放在属性的末尾

所以不要这样：

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'),

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

1 个答案: