1

ArrayController への contentBinding を持つEmber.Selectビューがあります。ArrayController に itemController を設定すると、突然次のエラーがスローされます: Uncaught TypeError: Cannot call method 'child' of null

最小限の例を次に示します。

<script type="text/x-handlebars" data-template-name="application">
    {{view Ember.Select viewName="select"
                    contentBinding="App.monstersController"
                    optionLabelPath="content.name"
                    optionValuePath="content.id"
                    prompt="Pick a monster:"
                    selectionBinding="App.stateController.selectedMonster"}}

</script>

そしてJavaScript：

window.App = Em.Application.create();

App.ApplicationController = Em.Controller.extend({});

App.ApplicationView = Em.View.extend({
    templateName: 'application'
});

App.data = [{
    id: 1,
    name: "Grog",
    strength: 10,
    species: "Troll"
}, {
    id: 2,
    name: "Ognog",
    strength: 8,
    species: "Goblin"
}, {
    id: 3,
    name: "Fred",
    strength: 3,
    species: "Human"
}];

App.stateController = Em.Controller.create({
    selectedMonster: null
});

App.MonsterController = Em.ObjectController.extend({
    name: function() {
        return "Controller Modified " + this.get('name');
    }.property('content.name')
});

App.MonstersController = Em.ArrayController.extend({
    content: App.data/*,
    itemController: "monster"*/
});

App.monstersController = App.MonstersController.create({});

ここにフィドルがあり、問題を示しています: http://jsfiddle.net/Malkyne/AkHhF/

ここで何が起こっているのか、またはどうすれば修正できるのか、誰にもわかりませんか?

4

1 に答える 1

1

かなりいじった後（ハ！）、実用的な解決策があると思います。手順は次のとおりです。

1.) ApplicationRoute仕様を追加して、コントローラーをセットアップします。それは次のようになります。

App.ApplicationRoute = Ember.Route.extend({
  setupController: function() {
    this.controllerFor('monsters').set('content', App.data);
  }
});

2.) Content要素をApp.MonstersControllerから削除します。これは、コンテンツが Router に割り当てられているためです。これで、次のようになります。

App.MonstersController = Em.ArrayController.extend({
    itemController: 'monster'
});

3.) テンプレートから Ember.Select ビューを完全に引き出します。そのビューを「モンスター」と呼んでも、そのコンテンツをモンスター コレクションにバインドする方法がわかりません。これを次のように置き換えます。

<script type="text/x-handlebars" data-template-name="application">    
    {{render monsters}}
</script>

4.) それでは、Ember.Select を拡張して新しいビューを作成しましょう。

App.MonstersView = Ember.Select.extend({
    contentBinding: 'this.controller',
    prompt: "Pick a monster:",
    selectionBinding: 'App.stateController.selectedMonster',
    optionLabelPath: 'content.name',
    optionValuePath: 'content.id'
});

ここに動作するフィドルがあります: http://jsfiddle.net/Malkyne/KGJXE/

したがって、この話の教訓は、最近のバージョンの Ember では、App 名前空間にぶら下がっているコントローラーがうまく動作しないように見えるということです。Route setupController関数でコントローラーを初期化すると、コントローラーの動作が大幅に向上するように見えます。

于 2013-02-24T10:34:25.920 に答える