为什么我的ember.js路径模型，被称为？(Why isn't my ember.js r

我刚开始学习Ember.js（买PeepCode截屏），并且正在学习从它比较顺利，但在尝试写我的第一灰烬应用程序时，遇到了一个问题。

这里的（嵌套）路由映射：

App.Router.map(function () {
    this.resource('bases', { path: '/' }, function () {
        this.resource('base', { path: ':base_id' }, function () {
            this.resource('places', function () {
                this.resource('place', { path: ':place_id' });
            });
        });
    });
});

这使得像这样的网址：domain.com/#/yokota-ab-japan/places/4c806eabd92ea093ea2e3872

yokota-ab-japan是碱（一个空军基地在日本）的id 4c806eabd92ea093ea2e3872上四方场地的id

当地方的路线被击中，我设置与向四方API的调用数据，遍历JSON创建App.Place对象的数组，并返回数组。

App.PlacesRoute = Ember.Route.extend({
    model: function () {
        var placesData = Ember.A();
        $.getJSON('https://api.foursquare.com/v2/venues/search?ll=35.744771,139.349456&query=ramen&client_id=nnn&client_secret=nnn&v=20120101',
            function (data) {
                $.each(data.response.venues, function (i, venues) {
                    placesData.addObject(App.Place.create({ id: venues.id, name: venues.name, lat: venues.location.lat, lng: venues.location.lng }));
                });
            });

        return placesData;
    }
});

这似乎运作良好。我显示使用此模板的placesData数组：

<script type="text/x-handlebars" data-template-name="places">
    <div>
        {{#each place in controller}}
            {{#linkTo 'place' place}}
                {{place.name}}
            {{/linkTo}}
        {{/each}}
    </div>

    {{outlet}}
</script>

该linkTo链接到各个地方，在这里我想显示某个地点的更多细节。下面是我的路线设置拉数据对一个地方，填充一个App.Place对象，并返回它：

App.PlaceRoute = Ember.Route.extend({
    model: function (params) {
        console.log('place route called');

        var place;
        $.getJSON('https://api.foursquare.com/v2/venues/' + params.place_id + '?client_id=nnn&client_secret=nnn',
            function (data) {
                var v = data.response.venue;
                place = App.Place.create({ id: v.id, name: v.name, lat: v.location.lat, lng: v.location.lng });
            });

        return place;
    }
});

我的问题是， PlaceRoute当用户点击一个链接，它不会叫，但是当页面被这条航线上刷新它被调用。

按照PeepCode Ember.js截屏（在〜12：25到视频），它指出：“很少控制器永远做数据呼叫，路由对象搞定”，所以我觉得我把我的Ajax调用的是正确的路线（我见过这么多的教程别共在网上，但由于Peepcode与Ember.js创造者协商，我用它去作为我的主要学习源）。

如果这是不正确，或者可以做的更好，请让我知道。

Answer 1:

该模型钩灰烬文档：

“一个钩子，你可以实现的URL转换成模型，这条路线。”

这就解释了为什么模型钩就被称为上页面刷新。但是，这混淆了很多人:-)。那么，这是不是在这种情况下，右曲球。我想你应该使用setupController钩这种情况。试试这个：

App.PlaceRoute = Ember.Route.extend({
    setupController: function (controller, model) {
        console.log('place route called');

        var place;
        $.getJSON('https://api.foursquare.com/v2/venues/' + model.get('place_id') + '?client_id=nnn&client_secret=nnn',
            function (data) {
                var v = data.response.venue;
                place = App.Place.create({ id: v.id, name: v.name, lat: v.location.lat, lng: v.location.lng });
            });

        controller.set("model", place);
    }
});

其他从自己的2美分： 为什么模型钩刚执行，当通过URL /浏览器直接导航输入的应用程式？

Ember公司拥有的假设，那你不一定对模型挂钩的电话，如果你使用{{linkTo}} 在你的地方模板中，您使用{{#linkTo 'place' place}} {{place.name}} {{/linkTo}} 你逝去的地方对象添加到您的路线。 灰烬假定这是同一个对象，即执行模型机时，你会得到。 所以从余烬查看有没有需要调用模型挂钩。所以，如果你想，即使你用它来执行检索逻辑linkTo ，使用setupController hook 。

Answer 2:

力灰烬使用该模型的挂钩; 只是通过ID而不是对象：

{{#link-to 'place' place.id}}
    {{place.name}}
{{/link-to}}

由于灰烬不再知道哪个对象与给定id，灰烬将调用模型挂钩（这样该数据将从服务器加载）。

Answer 3:

基于mavilein的答案，但更短，适合于灰烬CLI与Ember数据...

import Ember from 'ember';

export default Ember.Route.extend({
  setupController: function( controller, model ) {
    controller.set( "model", this.store.fetch( 'place', model.id ) );
  },
});

还要注意的是获取方法只能从灰烬数据1.0.0-beta.12。

http://emberjs.com/api/data/classes/DS.Store.html#method_fetch

文章来源: Why isn't my ember.js route model being called?