EmberJS Direct Slug URL访问不工作 [英] EmberJS Direct Slug URL Access Not Working
问题描述
到:
http://mydomain.com/#/posts/first-awesome-post
问题是,如果我直接通过直接访问网页( http: //mydomain.com/#/posts/first-awesome-post ),我得到一个空白页。
这是我有的: / p>
App.Router.map(function(){
this.resource('posts',function(){
this.resource('post',{path:':post_id'});
});
});
App.Post.FIXTURES = [{
id:1,
name:'First Awesome Post',
slug:'first-awesome-post'
}];
App.PostRoute = Em.Route.extend({
model:function(params){
return App.Post.find(params.post_id);
}
setupController:function(controller,model){
this._super.apply(this,arguments);
},
serialize: function(model,params){
return {post_id:model.get('slug')};
},
});
我尝试过以下操作:
- 将
App.PostRouter
中的params.post_id
替换为params。 post_slug
并输入以下URL到我的浏览器 http:// mydomain .COM /#/职位/第一真棒-帖子;结果:页面CSS和HTML加载但id#1的数据没有加载(即模型钩子不被调用) - 摆脱了序列化功能并输入了以下URL到我的浏览器 http://mydomain.com/#/posts/1 ;结果:一切正常(CSS,HTML和数据完美加载)
我可以知道我在这里做了什么错案件?
我正在使用EmberJS版本1.0.0-rc.6
如果你想使用s子,你应该更改模型函数并使用findQuery,因为您正在通过id http://emberjs.com/api/data/classes/DS.Store.html#method_findQuery ,但是这个函数返回一个RecordArray,你可以使用setupController钩子来设置数组的唯一一个对象
App.Router.map(function(){
this.resource('posts',function(){
this.resource('post',{path:':post_slug'});
});
});
App.Post.FIXTURES = [{
id:1,
name:'First Awesome Post',
slug:'first-awesome-post'
}];
App.PostRoute = Em.Route.extend({
model:function(params){
return App.Post.findQuery({slug:params.post_slug});
},
setupController:function(controller,model){
//如果模型来自一个link-to helper,它将是一个对象,如果它来自路由,它将是一个元素的数组
if(Ember.isArray(model)){
controller.set('model',model.get('firstObject'));
}
else {
controller.set('model',model);
}
},
serialize:function(model,params){
return {post_slug:model.get('slug')};
},
});
I am using slugged URLs for cleaner URLs to convert from this:
to this:
The problem is that, if I were to directly access the page via direct slugged url (http://mydomain.com/#/posts/first-awesome-post), I got a blank page instead.
Here is what I have:
App.Router.map(function() {
this.resource('posts', function() {
this.resource('post', { path: ':post_id' });
});
});
App.Post.FIXTURES = [{
id: 1,
name: 'First Awesome Post',
slug: 'first-awesome-post'
}];
App.PostRoute = Em.Route.extend({
model: function(params) {
return App.Post.find(params.post_id);
},
setupController: function(controller, model) {
this._super.apply(this, arguments);
},
serialize: function(model, params) {
return { post_id: model.get('slug')};
},
});
I have tried the following:
- Replaced
params.post_id
inApp.PostRouter
toparams.post_slug
and entered the following URL to my browser http://mydomain.com/#/posts/first-awesome-post; Result: The page CSS and HTML loads but the data of id #1 did not load (i.e. model hook isn't called) - Got rid of serialize function and entered the following URL to my browser http://mydomain.com/#/posts/1; Result: Everything works fine (CSS, HTML, and data got loaded perfectly)
May I know what I have been doing wrong in this case?
P.S. I am currently using EmberJS version 1.0.0-rc.6
If you want to use the slug you should change the model function and make use of findQuery as you are seaching a model by an attribute other than id http://emberjs.com/api/data/classes/DS.Store.html#method_findQuery, but this function returns an RecordArray, you could use the setupController hook for setting the only one object of the array
App.Router.map(function() {
this.resource('posts', function() {
this.resource('post', { path: ':post_slug' });
});
});
App.Post.FIXTURES = [{
id: 1,
name: 'First Awesome Post',
slug: 'first-awesome-post'
}];
App.PostRoute = Em.Route.extend({
model: function(params) {
return App.Post.findQuery({slug:params.post_slug});
},
setupController: function(controller, model) {
//If the model comes from a link-to helper it will be an object, if it comes from the route it will be an array of one element
if(Ember.isArray(model)){
controller.set('model',model.get('firstObject'));
}
else{
controller.set('model',model);
}
},
serialize: function(model, params) {
return { post_slug: model.get('slug')};
},
});
这篇关于EmberJS Direct Slug URL访问不工作的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!