Emberjs，目标模型不离开'/ models'url [英] Emberjs, Target a model without leaving '/models' url

问题描述

我有一个模型表，我想要能够点击我的 {{action'edit'}} ，其中一个模型将会知道哪个模型＃ {{action'edit'}} 在。

现在我收到这个错误： GET localhost：3000 / category / undefined 404（未找到）'

这是我的代码在'/ categories'路线。

 < tbody> 
 {{#each}} 
< tr class =people-list> 
< td> 
< input type =checkboxclass =toggle> 
 {{#if isEdit}} 
 {{view Ember.TextField valueBinding =Namename =Name}} 
 {{else}} 
< label class =category-text> {{＃linkTo'category'this}} {{Name}} {{/ linkTo}}< / label> 
 {{/ if}} 
< img class =table-imgsrc =images / x.png> 
< img class =table-img{{action'edit'}} src =images / pencil-grey.png> 
< / td> 
< / tr> 
 {{/ each}} 
< / tbody> 
  

然后在控制器上：

  actions：{
 edit：function（）{
 this.set（'isEdit'，true）; 
} 
} 
  

当我点击

 < img class =table-img{{action'edit'}} src =images / pencil-grey.png> 
  

和模型

  VpcYeoman.Category = DS.Model.extend（{
 RecordCategoryID：DS.attr（'number'），
名称：DS.attr（'string'），
 ProjectName：DS.attr（'string'），
 WorkDescription：DS.attr（'string'），
工作流：DS.belongsTo（'category'，{
 polymorphic：true 
}），
 classNameBindings：['isAdministrator'] 
}）; 
 
 VpcYeoman.Calendar.FIXTURES = [
 
 {
 id：0，
 RecordCategoryID：0，
名称：Fire 
 ProjectName：Electra
}，
 
 {
 id：1，
 RecordCategoryID：1，
名称：水 
 ProjectName：Nike
} 
 
]; 
  

和router.js

  this.resource（'categories'，{path：'/ categories'}）; 
 this.resource（'category'，{path：'/ category /：category_id'}，function（）{
 this.route（'edit'）; 
}）; 
  

我不知道我是否应该添加关于'编辑'到路由器的任何东西，因为我做不想让程序必须更改URL才能专注于特定的模型。

解决方案

有一个非常简单的解决方案，只需将模型发送到动作中。

 < img class =table-img{{action'edit'this} } src =images / pencil-grey.png> 
 
 actions：{
 edit：function（model）{
 model.set（'isEdit'，true）; 
} 
} 
  

未定义的是Ember尝试生成URL当您点击链接。它正在使用模型，然后在模型上查找 category_id 来构建唯一的URL。唉，你没有这个模型的属性，所以你需要修复你的路线来告诉Ember如何序列化你的模型。

  App.CategoryRoute = Em.Route.extend（{
 serialize：function（model）{
 return {category_id：model.get（'id'）}; 
} 
}）; 
  

I have a table of models and I want to be able to click my {{action 'edit'}} in one of those model's and ember will know which model # the {{action 'edit'}} is in.

Right now I am receiving this error: 'GET localhost:3000/category/undefined 404 (Not Found) '

Here is my code in the '/categories' route.

<tbody>
    {{#each}}
      <tr class="people-list">
        <td>
            <input type="checkbox" class="toggle">
            {{#if isEdit}}
            {{view Ember.TextField valueBinding="Name" name="Name"}}
            {{else}}
            <label class="category-text">{{#linkTo 'category' this}}{{Name}}{{/linkTo}}</label>
            {{/if}}
            <img class="table-img" src="images/x.png">
            <img class="table-img" {{action 'edit'}} src="images/pencil-grey.png">
            </td>
        </tr>
    {{/each}}
</tbody>

And then on the controller:

actions: {
    edit:function(){
        this.set('isEdit', true);
    }
}

the 404 occurs when i click

<img class="table-img" {{action 'edit'}} src="images/pencil-grey.png">

and the model

VpcYeoman.Category = DS.Model.extend({
    RecordCategoryID:DS.attr('number'),
    Name: DS.attr('string'),
    ProjectName: DS.attr('string'),
    WorkDescription: DS.attr('string'),
    workflow: DS.belongsTo('category', {
        polymorphic: true
    }),
    classNameBindings: ['isAdministrator']
});

VpcYeoman.Calendar.FIXTURES = [

  {
    id: 0,
    RecordCategoryID: 0,
    Name: "Fire",
    ProjectName: "Electra"
  },

  {
    id: 1,
    RecordCategoryID: 1,
    Name: "Water",
    ProjectName: "Nike"
  }

];

and router.js

  this.resource('categories', { path: '/categories' });
  this.resource('category', { path: '/category/:category_id' },function() { 
    this.route('edit');
  });

I wasn't sure if i should have added anything about 'edit' to the router because i did not want the program to have to change URLs in order to focus onto a specific model.

解决方案

There is a pretty simple solution, just send the model into the action.

<img class="table-img" {{action 'edit' this}} src="images/pencil-grey.png">

actions: {
  edit: function(model){
    model.set('isEdit', true);
  }
}

The undefined is coming from Ember trying to generate the url when you click the link-to. It's taking the model then looking for category_id on the model to build the unique url. Alas, you don't have that property on the model, so you need to fix up your route to tell Ember how to serialize your model.

App.CategoryRoute = Em.Route.extend({
  serialize: function(model){
    return {category_id: model.get('id')};
  }
});

这篇关于Emberjs，目标模型不离开'/ models'url的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！