我正在父路线中填充我的模型,并向我的后端服务器调用AJAX,一切都可以使用,但我试图只显示基于今天的儿童路线日期的某些项目,但我'我遇到了麻烦。
这是我的路由器
Aplus.Router.map(function () {
this.resource('index', { path: '/'});
this.resource('Dashboard', function() {
this.resource('Agents', function() {
this.resource('AllAgents');
});
this.resource('Jobs', function() {
this.resource('AllJobs');
this.resource('TodaysJobs');
this.resource('NewJob');
});
});
在Jobs路线中,我正在填充模型,我想在TodaysJobs路线中显示模型的过滤版本
Aplus.JobsRoute = Ember.Route.extend({
model: function() {
var self = this; //otherwise will lose context of this in getJSON
var jobObjects = [];
Ember.$.getJSON('/jobs', function(jobs) {
jobs.forEach(function(job) {
jobObjects.pushObject(self.store.createRecord("job", job));
});
});
return jobObjects;
},
});
Aplus.TodaysJobsRoute = Ember.Route.extend({
renderTemplate: function() {
this.render('todaysJobs');
}
});
这就是我在控制器中所拥有的(在JobsController中没有任何内容)
Aplus.TodaysJobsController = Ember.ObjectController.extend({
filtered: function() {
console.log(this.store.find('Job'));
return this.store.find('Job').filteryBy('jobDate', '2015-2-7', true);
}.property('Job'),
});
我不确定我是否正在使用Ember的属性,当我运行它时,我得到一个错误,说无法读取属性长度为null。
这就是我的模板:
<table class="table table-striped" id="jobs">
<thead>
<tr>
<th> Job Date </th>
<th> Customer Name </th>
<th> Address </th>
<th> City </th>
<th> Phone Number </th>
<th> Status </th>
<th> Total Cost </th>
<th> Notes </th>
<th> Agent First Name </th>
<th> Agent Last Name </th>
<th> </th>
</tr>
</thead>
<tbody>
{{#each job in filtered}}
<tr>
<td> {{job.jobDate}} </td>
<td> {{job.customerName}} </td>
<td> {{job.customerAddress}} </td>
<td> {{job.customerCity}} </td>
<td> {{job.customerPhoneNo}} </td>
<td> {{job.status}} </td>
<td> {{job.totalCost}} </td>
<td> {{job.notes}} </td>
<td> {{job.agentFirstname}} </td>
<td> {{job.agentLastname}} </td>
<td> <button class="btn btn-secondary">Edit</td>
</tr>
{{/each}}
<tbody>
</table>
任何帮助都会非常感激。
答案 0 :(得分:0)
model: function() {
return this.store.find('job');
});
将模型重命名为使用job而不是Job,ember遵循camelcase约定,如果你不在AJAX调用上更改它,它可能会/ Jobs
在这里做这个
Aplus.TodaysJobsRoute = Ember.Route.extend({
renderTemplate: function() {
this.render('todaysJobs');
},
model: function() {
return store.filter('job', function(job) {
return Ember.isEqual(job.get('jobDate'), '2015-2-7');
});
}
});
将您的控制器更新为ArrayController并丢失已过滤的计算属性
Aplus.TodaysJobsController = Ember.ArrayController.extend({});
并且你的TodaysJob模板应该如下所示
<table class="table table-striped" id="jobs">
<thead>
<tr>
<th> Job Date </th>
<th> Customer Name </th>
<th> Address </th>
<th> City </th>
<th> Phone Number </th>
<th> Status </th>
<th> Total Cost </th>
<th> Notes </th>
<th> Agent First Name </th>
<th> Agent Last Name </th>
<th> </th>
</tr>
</thead>
<tbody>
{{#each job in controller}}
<tr>
<td> {{job.jobDate}} </td>
<td> {{job.customerName}} </td>
<td> {{job.customerAddress}} </td>
<td> {{job.customerCity}} </td>
<td> {{job.customerPhoneNo}} </td>
<td> {{job.status}} </td>
<td> {{job.totalCost}} </td>
<td> {{job.notes}} </td>
<td> {{job.agentFirstname}} </td>
<td> {{job.agentLastname}} </td>
<td> <button class="btn btn-secondary">Edit</td>
</tr>
{{/each}}
<tbody>
</table>