0

我正在尝试在我的 ember 路由中使用已经实例化的控制器。

实例化一个控制器并想在路由中使用它是不正常的吗?我知道,如果我的应用程序为我实例化了一个控制器,那么我可以这样做,router.get("myController")但它不会访问我自己实例化的控制器。

如何让路由器底部的代码工作?

HTML

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


<script type="text/x-handlebars" data-template-name="instanced">
    <h1>Hello from instanced template</h1>
    {{showinstancedvalue}}<hr>
    {{outlet}}
</script>


<script type="text/x-handlebars" data-template-name="foobar">
    <h1>hello from foobar</h1>
    {{foobarvalue}}
</script>

Javascript

var App = Ember.Application.create();
// application view and controller
App.ApplicationView = Ember.View.extend({
    templateName: 'application',
});
App.ApplicationController = Ember.Controller.extend();




// foobar controller and view
App.FoobarController = Ember.Controller.extend({
    foobarvalue: "working"
});
App.FoobarView = Ember.View.extend({
    templateName: 'foobar'
});



// instantiated controller and view
App.InstancedController = Ember.Controller.extend({});
App.instancedController = App.InstancedController.create({
    myvar: "a value from an instantiated controller"
});
App.InstancedView = Ember.View.extend({
    templateName: 'instanced',
});
App.instancedView = App.InstancedView.create({
    showinstancedvalueBinding: 'App.instancedController.myvar'
});

App.instancedView.append();

App.router = Ember.Router.create({
    enableLogging: true,
    root: Ember.Route.extend({
        index: Ember.Route.extend({
            route: '/',
            redirectsTo: 'works'
        }),
        works: Ember.Route.extend({
            route: '/works',
            connectOutlets: function(router) {
                router.get('applicationController').connectOutlet('foobar');
            }
        }),
        broken: Ember.Route.extend({
            route: '/broken',
            connectOutlets: function(router) {

                // no error in console, but foobar doesn't appear
                // router.get('instancedController').connectOutlet('foobar');

                // *** this one was my best guess as to what I thought would work ***
                // no error in console, but foobar doesn't appear
                // App.instancedController.connectOutlet('App.Foobar');

                // Uncaught Error: assertion failed: The name you supplied foobar did not resolve to a view FoobarView
                // App.instancedController.connectOutlet('foobar');
            }
        }),

    })
});

App.initialize(App.router);​
4

2 回答 2

3

查看connectOutlet定义,它包含一个基本文档作为注释,因此您可以更好地了解它应该如何使用或如何使用。

基本上,您应该真正将它连接到applicationController,因为它{{outlet}}位于ApplicationView模板上。在这种情况下,框架将找到应该在该状态下使用的视图和控制器(在您的情况下FoobarViewfoobarController因为它是使用参数 'foobar' 指定的),并添加controllersapplicationController. 如果你尝试直接连接到你的实例foobarController,它不会在它的视图上找到一个出口(我相信那一刻不应该被实例化)并且你会对那个控制器说“嘿,找到你自己,然后将自己与您联系起来”之类的东西。

如果您在 foobar 视图模板中有一个插座,并且您将此插座连接到 foobar 以外的其他东西(作为子状态/路由),这可能会起作用。所以你应该阅读更多关于网点和命名网点的信息。

此外,我强烈推荐这些链接:

于 2012-11-13T20:23:10.290 回答
1

您应该尝试详细说明您的要求。从我的角度来看,这没有任何意义。

    broken: Ember.Route.extend({
        route: '/broken',
        connectOutlets: function(router) {
            App.foobarController.connectOutlet('foobar');
        }
    }),

此代码无法正常工作,因为您正在调用 fooBarController 上的 connectOutlet。因此它在分配视图中搜索 {{outlet}}。但是在名为 foobar 的模板中,您没有指定 {{outlet}}。即使你解决了这个问题,它也没有任何意义,因为这条线会尝试将一个插座与一个新的 Foobar View 实例连接起来。因此,您基本上拥有 FooBarController 的 FooBarView 并在其视图内,您尝试再次将插座与 FooBarView 的新实例连接?

因此,如果不解释要求,则无法回答此问题。

于 2012-11-13T18:51:00.560 回答