通过行动控制器不工作

Question

我有以下的车型，客户设置一个属于关联属性的区域的下拉列表中的客户是 -

{{view Ember.Select viewName="select_area" content=possible_areas optionValuePath="content.id" optionLabelPath="content.name" value=area.id prompt="No area selected" selectionBinding="selected_area"}} 

和控制器，其导线了一切一起 -

App.CustomerController = Ember.ObjectController.extend({ 
    possible_areas: function() { 
     return this.store.find('area'); 
    }.property(), 

    selected_area: null, 
    actions: { 
     save: function() { 
      var selected_area_id = this.get('selected_area.id'); 
      console.log(selected_area_id); 
      var selected_area = this.store.find('area', selected_area_id); 
      var self = this; 
      selected_area.then(function(area) { 
       console.log(area.get('id')); 
       var updated_customer = self.get('model'); 
       updated_customer.set('area', area); 
       console.log(new_customer.get('area.id')); 
       updated_customer.save() 
        .then(function(customer) { 
         //success 
        }, 
        function() { 
         //failure 
        }); 
      }); 
     } 
    } 
}); 

现在这里是奇怪的事情。当打电话的“拯救”行动的第一次，行updated_customer.set('area', area);失败，错误

Uncaught Error: Assertion Failed: Cannot delegate set('id',) to the 'content' property of object proxy <DS.PromiseObject:ember551>: its 'content' is undefined. 

当打电话“保存”后，立即采取行动，保存经过没有被成功更新客户的任何错误和地区。尽管下拉菜单显示selected_area为空。

如何防止第一次保存错误？

我使用的是ember-data 1.0.0-beta.6。

Answer 1

由于您在Customer模型中定义了关联，我将从控制器中删除selected_area属性，并改为使用ember-data的关联。使用selectionBinding属性绑定到Ember.Select中的“区域”关联。

{{view Ember.Select viewName="select_area" 
        content=possible_areas 
        optionValuePath="content.id" 
        optionLabelPath="content.name" 
        prompt="No area selected" 
        selectionBinding="area"}} 

这样，当用户与选择菜单交互的area属性会发生变化。

由于我们直接绑定到Customer的area关联，所以这还具有清理save操作的额外好处。

App.CustomerController = Ember.ObjectController.extend({ 
    possible_areas: function() { 
    return this.store.find('area'); 
    }, 

    actions: { 
    save: function() { 
     this.get('model').save().then(this.onDidCreate.bind(this), this.onDidFail.bind(this))  
    } 

    onDidCreate: function() { 
     // Fullfilled callback 
    } 

    onDidFail: function() { 
     // Rejected callback 
    } 
    } 
}); 

然而，possible_areas属性不会被当模板，因为this.get('area')回报承诺第一渲染填充。我会等待呈现选择，直到承诺落定。您可以在路由model钩子中执行此操作，因为它会等待承诺解决以呈现模板。

App.CustomerRoute = Ember.Route.extend({ 
    route: function(params) { 
    return Ember.RSVP.hash({ 
     customer: this.store.find('customer', params.customer_id), 
     possible_areas: this.store.find('area') 
    }); 
    }, 

    // Since the route hook returns a hash of (hopefully) settled promises, we 
    // have to set the model property here, as well as the possible_areas property. 
    setupController: function(controller, model) { 
    controller.set('model', model.customer); 
    controller.set('possible_areas', model.possible_areas); 
    } 
});