首页 > 代码库 > ember.js:使用笔记6 子项目的前进与后退
ember.js:使用笔记6 子项目的前进与后退
如下代码会根据model产生不同的table项，在进行其他设置后，一般是根据id来跳转到相应项目子项中；
{{#each}} {{#link-to "tabls" this}}{{name}}{{/link-to}}{{/each}} 这时候我们可能需要一额外的按钮而不是直接点击连接进行子项目的前进与后退，可采用如下方法：
方法1：
在对应controller内设置：
nextId : function(){ var arrs = //获得对应子项目的content； var thisId = //获得当前项目的id； for(var idx=0; idx < arrs.length; idx++) { if(arrs[idx].id > thisId) break; } idx = idx < arr.length ? idx : 0; return arrs[idx].id;} prevId : function(){ var arrs = ..; var thisId = ..; for(var idx = arrs.length-1; idx >=0; idx--) { if(arrs[idx].id < thisId) break; } idx = idx >=0 ? : arrs.length - 1; return arrs[idx].id;} 然后在相应模版中设置：
{{#link-to "testResult" nextId}}next{{/link-to}} {{#link-to "testResult" prevId }}prevId{{/link-to}} //这里说明连接是可以通过直接使用id跳转；方法2：
在对应controller内设置：
nextId: function() { var quizs = //获取项目, index = quizs.indexOf(this.get("model")); return quizs.objectAt(index+1); }.property("model.id"), prevId: function() { var quizs = //获取项目, index = quizs.indexOf(this.get("model")); return quizs.objectAt(index-1); }.property("model.id"),然后在模版中设置：
{{#if nextId}} {{#link-to "testResult" nextId}}next{{/link-to}}{{/if}}{{if prevId}} {{#link-to "testResult" prevId }}prevId{{/link-to}} {{/if}}//这里说明连接也可以通过传入对应子项目跳转；方法3：
在对应controller内设置：
advanceQuiz: function(delta) { var index,length,quizs; quizs = //获得项目; length = quizs.get("length"); index = (quizs.indexOf(this.get("model")) + delta + length) % length; return this.transitionToRoute("testResult",quizs.objectAt(index)); //这里使用transitionToRoute，注意后面的route要书写正确； }, actions: { nextId: function() { return this.advanceQuiz(-1); }, prevId: function() { return this.advanceQuiz(1); } },然后在模版中直接设置action就可以了，这里并没有使用链接，而是使用transitionToRoute方法来跳转；
ember.js:使用笔记6 子项目的前进与后退
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。