Question

这个问题是以下emberjs display an object return from an ajax call

的问题

为了恢复一点，我有一个动态列表，为该列表的每个项目生成一些按钮。我抓住了这个类的任何按钮事件：

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的查询（例如：/＃/ inquiry / 1）

但问题来自我的更新课程。我只是创建一个带有动作助手的按钮来显示更新表单：

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

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

我不知道如何发生这种情况以及如何在此过程中解除身份......

感谢您的帮助。

[edit]如果你需要知道我的findOne函数是什么：

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');
        }
    });
}

在您点击列表中的相关按钮后，它会从服务器获取每个项目的数据。

以下是我回来的对象：

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":"Marco@email.com",...}"
setRequestHeader: function ( name, value ) {
state: function () {
status: 200
statusCode: function ( map ) {
statusText: "OK"
success: function () {
then: function ( /* fnDone, fnFail, fnProgress */ ) {
__proto__: Object

Answer 1

这里有很多问题。你正在做的一些事情是非常“非余地”的惯用语，如果结果出现进一步的问题，我也不会感到惊讶。但我会专注于提出的问题，如果你想要更多关于调整更多细分的建议，我很乐意提供它。

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

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

在您的地图中，但查询对象看起来某事，如：

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

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

解决方案1：调整模型

如果您想保持地图不变，则需要调整模型以获得enquiry_id字段，例如：

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

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

虽然更改地图会更容易。为此，请使用以下地址替换您在地图上的查询资源：

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

.告诉ember所需元素是id对象中的enquiry字段。

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

param.enquiry_id

要：

param['enquiry.id']

Emberjs访问嵌套属性

1 个答案:

解决方案1：调整模型

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