Emberjs访问嵌套属性 [英] Emberjs access a nested property

问题描述

此问题是此这个问题的后续内容从ajax调用返回对象

为了恢复一点，我为列表中的每个项目生成了一个带有一些按钮的动态列表。我用此类捕获了任何按钮的事件：

To resume a bit, I have a dynamic list generated with some button for each item of that list. I catch the event of any button with this class :

App.EnquiriesView = Ember.View.extend({
    didInsertElement: function() {
        var that = this;

        this.$().on('click', '.view-btn', function(){
            var id = $(this).attr('data-value');
            that.get('controller').send('clickBtn', id);
        });
    }
});

然后转到我的控制器：

App.EnquiriesController = Ember.ObjectController.extend({
    actions: {
        clickBtn: function( id ) {
            console.log('DEBUG: ClickBtn OK id = ' + id);
            //console.log(App.Enquiries.findOne(id));

            this.transitionToRoute('enquiry', /*App.Enquiries.findOne(id)*/id);
        }
    }
});

与路由器相关：

App.EnquiryRoute = Ember.Route.extend({
    model: function( param ) {
        console.log('Enquiry id = ' + param.enquiry_id);
        return App.Enquiries.findOne(param.enquiry_id);
    }
});

和我的地图：

App.Router.map(function() {
    this.resource('login', { path: '/' });
    this.resource('home');
    this.resource('enquiries', function (){
        this.route('create');
    });
    this.resource('enquiry', { path: 'enquiry/:enquiry_id' }, function(){
            this.route('update');
        });
});

到目前为止，到目前为止，当用户单击按钮时，它已正确重定向到具有良好URL的查询（例如：/＃/ enquiry / 1）

So far for now when the user click on the button its redirect correctly to the enquiry with the good URL (e.g : /#/enquiry/1)

但是问题出在我的更新类上。我刚刚用动作助手创建了一个按钮，以显示更新表单：

But the problem is coming from my update class now. I've just create a button with the action helper to display the update form :

App.EnquiryController = Ember.ObjectController.extend({
    actions: {
        update: function() {
            console.log('DEBUG: in EnquiryController update');
            console.log(this.get('model'));
            this.transitionToRoute('enquiry.update');
        }
    }
});

因此，当您单击更新按钮时，您将重定向到这种URL：/＃/ enquiry / undefined / update而不是/＃/ enquiry / 1 / update ...

So when you click on the update button you are redirected to this kind of URL : /#/enquiry/undefined/update instead of /#/enquiry/1/update ...

我不知道这种情况会如何发生以及在处理...

I don't know how this can happen and how I can loose my id during the process...

感谢您的帮助。

如果您需要知道我的是什么， findOne函数：

[edit] If you need to know what is my findOne function :

findOne: function(id) {
    return $.ajax({
        url: host + 'mdf/enquiry/' + id,
        type: 'GET',
        accepts: 'application/json',
        success: function (data) {
            console.log('DEBUG: GET Enquiry ' + id + ' OK');
        },
        error: function() {
            console.log('DEBUG: GET Enquiry ' + id + ' Failed');
        }
    });
}

点击后，它会从服务器获取每个项目的数据

Its fetching the data from the server for every item after you've click on the related button in the list.

这是我回来的对象：

Object {readyState: 1, getResponseHeader: function, getAllResponseHeaders: function, setRequestHeader: function, overrideMimeType: function…}
abort: function ( statusText ) {
always: function () {
complete: function () {
done: function () {
error: function () {
fail: function () {
getAllResponseHeaders: function () {
getResponseHeader: function ( key ) {
overrideMimeType: function ( type ) {
pipe: function ( /* fnDone, fnFail, fnProgress */ ) {
progress: function () {
promise: function ( obj ) {
readyState: 4
responseJSON: Object
responseText: "{"ok":true,"enquiry":{"id":1,"domainid":"domain","userid":"userid","status":null,"type":"new","customerName":"Marco","customerEmail":"[e-mail]",...}"
setRequestHeader: function ( name, value ) {
state: function () {
status: 200
statusCode: function ( map ) {
statusText: "OK"
success: function () {
then: function ( /* fnDone, fnFail, fnProgress */ ) {
__proto__: Object

推荐答案

这里有很多问题。您正在做的几件事非常惯用，如果结果出现其他问题，我也不会感到惊讶。但是，我将重点关注所提出的问题，如果您需要更多关于调整细分受众群的建议，我们很乐意提供。

There's a number of issues going on here. A couple of things you're doing are very "non-ember" idiomatic, and I wouldn't be surprised if further issues pop up as a result. But I'll focus on the question asked, and if you want more advice on adjusting further segments I'm happy to provide it.

简而言之，您有以下内容代码：

In short, you have the following code:

this.resource('enquiry', { path: 'enquiry/:enquiry_id' });

在您的地图中，但查询对象看起来像某物一样：

in your map, but an enquiry object that looks something like:

{"ok":true,
"enquiry":{
    "id":1,
    "domainid":"motorpark",
    "userid":"motorpark/mpuser"‌​
    ...
    }   
}

这些不匹配。您的地图定义了它是由模型中不存在的字段 enquiry_id *进行序列化的。要解决此问题，您可以执行以下解决方案之一：

And these don't match. Your map defines that it is serialized by a field enquiry_id *which does not exist on your model. To fix this you can do one of these solutions:

如果需要为了使地图保持原样，您需要调整模型以包含 enquiry_id 字段，例如：

If you want to keep your map as is, you'll need to adjust your model to have an enquiry_id field, such as:

{"ok":true,
"enquiry_id":1,
"enquiry":{
    "id":1,
    "domainid":"motorpark",
    "userid":"motorpark/mpuser"‌​
    ...
    }   
}

解决方案2：调整地图（推荐）

只需更改您的地图即可虽然地图。为此，请将您的查询资源替换为：

Solution 2: Adjust your Map (recommended)

It's easier to just change your map though. To do this, replace your enquiry resource on the map with:

this.resource('enquiry', {path: 'enquiry/:enquiry.id'});

。告诉余烬期望的元素是查询对象内的 id 字段。

The . tells ember that the desired element is the id field within the enquiry object.

您还需要修改访问参数值的方式。因为您要将参数的元素命名为 enquiry.id ，所以在检索值时需要将其指定为变量名而不是路径。在您的路线上，更改以下所有实例：

You'll also need to modify how you access the param value. Because you're naming an element of the param as enquiry.id you need to specify this as a variable name and not a path when retrieving the value. On your route, change all instances of:

param.enquiry_id

收件人：

param['enquiry.id']

这篇关于Emberjs访问嵌套属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！