当我直接从浏览器访问我的网址时遇到问题,它不会加载我的单一帖子信息。
示例:/index.html#/posts/10052308
但当我访问 /index.html#/posts 然后单击我的一篇文章时,它会起作用,我的网址会更改为 /index.html#/posts/10052308 并且可以工作,但如果我直接在此网址上刷新页面,则不会不再工作了。
我正在从 API (JSON) 加载数据。
在我的JS中:
App.Router.map(function() {
this.resource('posts', function() {
this.resource('post', { path: ':id' });
});
});
App.Posts = Ember.Object.extend();
App.Posts.reopenClass({
allPosts: [],
all: function(page, sort, order){
this.allPosts = [];
$.ajax({
url: 'http://intense-bastion-3210.herokuapp.com/run_sessions.json',
dataType: 'json',
data: "page=" + page + "&sort_by=" + sort + "&order=" + order,
context: this,
success: function(response){
console.log(response);
response.run_sessions.forEach(function(posts){
this.allPosts.addObject(App.Posts.create(posts))
}, this)
}
})
postsList = this.allPosts;
return this.allPosts;
}
});
App.PostsRoute = Ember.Route.extend({
model: function() {
var sortColumn = Ember.computed.alias('parentController.sortedColumn');
return App.Posts.all("1", "id", "desc");
}
});
App.PostRoute = Ember.Route.extend({
model: function(params) {
return posts.findBy('id', params.id);
}
});
在我的html中
<script type="text/x-handlebars" id="posts">
<div class="container-fluid">
<div class="row-fluid">
<div class="span3">
<table class='table'>
<thead>
<tr><th>Runs</th></tr>
</thead>
{{#each model}}
<tr><td>
{{#link-to 'post' this}}{{id}}{{/link-to}}
</td></tr>
{{/each}}
</table>
</div>
<div class="span9">
{{outlet}}
</div>
</div>
</div>
</script>
<script type="text/x-handlebars" id="post">
<h3>ID: {{id}}</h3>
<h3>Sport TYPE: {{sport_type_id}}</h3>
<h3>Start Time: {{start_time}}</h3>
<h3>End Time: {{end_time}}</h3>
<h3>Duration: {{duration}}</h3>
<h3>Distance: {{distance}}</h3>
<h3>Encoded Trace: {{encoded_trace}}</h3>
<hr>
</script>
这是我打开 /index.html#/posts/ 并单击任何帖子的时候https://i.stack.imgur.com/Hryge.png https://i.stack.imgur.com/Hryge.png
这是我刷新页面或直接访问的时候https://i.stack.imgur.com/ht8Bc.png https://i.stack.imgur.com/ht8Bc.png
有人可以帮我吗?