Question

我的Ember App中有一条显示优惠清单的路线; 该模型由jquery ajax加载（我不使用Ember数据）：

    Ember.$.ajax({
        type: 'GET',
        url: App.restAPIpath + '/offers/', 
        headers: {
            "tokens": localStorage.tokens
        },
        async: false
    }).then(function(res) {
        data = res.offers;
    });
    return data;

使用数据表在模板中显示商品，每行都有一个删除按钮，用于向服务器发送ajax删除请求并正确删除正确的商品：

{{#view App.dataTableView}}
    <thead>
        <tr>
            <th>Created</th>
            <th>Name</th>
            <th>Deadline</th>
            <th>Duration</th>
            <th>Delete?</th>
        </tr>
    </thead>

    <tfoot>
        <tr>
            <th>Created</th>
            <th>Name</th>
            <th>Deadline</th>
            <th>Duration</th>
            <th>Delete?</th>
        </tr>
    </tfoot>

    <tbody>
        {{#each offer in model}}
            <tr>
                <td>
                    {{offer.createdAt}}
                </td>
                <td>
                    {{#link-to 'eng.offers.edit' offer}}{{offer.name}}{{/link-to}}
                </td>
                <td>
                    {{offer.deadline}}
                </td>
                <td>
                    {{offer.optionDuration}}
                </td>
                <td>
                    <button class="form-button-red" {{action "deleteOffer" offer}}>Delete</button>
                </td>
            </tr>
        {{/each}}
    </tbody>
{{/view}}

但是我需要更新模型（并刷新视图？），因为如果没有删除的优惠仍然显示，直到您刷新页面...

Answer 1

我建议将你的ajax切换到异步，你会阻止路由器做其他重要事情。您应该能够完成相同的结果：

return Ember.$.ajax({
    type: 'GET',
    url: App.restAPIpath + '/offers/', 
    headers: {
        "tokens": localStorage.tokens
    },
}).then(function(res) {
    return res.offers;
});

然后我会在您的控制器delete操作中执行类似这样的删除操作（我会猜测您的一些代码）：

actions:{
  delete: function(item){
    var self = this;
    Ember.$.ajax({
        type: 'DELETE',
        url: App.restAPIpath + '/delete/' + item.get('id'), 
        headers: {
            "tokens": localStorage.tokens
        },
    }).then(function(){
      //manually remove the item from your collection
      self.removeObject(item);
    });
  }
}

BTW我认为删除是一个保留的关键词，jslint和一些最小化器是完全仇恨，所以你可能会做deleteItem

之类的事情。

在Ember js中重新执行模型钩子和重新渲染

1 个答案: