1

当您想使用Em.Application.create()在路由器中创建的类时,您需要在 application.create 之外指定路由器。但是因为应用程序是自动初始化的,所以路由器不会路由到/路由。

您过去可以通过添加autoinit: false到 application.create 来推迟初始化。现在你应该使用App.deferReadiness()and App.advanceReadiness()。但是,这似乎不起作用。

而且我似乎无法摆脱您“应该”以不同方式做事的感觉。

我添加了最少的代码来显示下面的问题。这里还有一个jsfiddle

编辑:

显然 ember 中有一个新路由器,我有点忽略了这一点。我已将代码更改为新路由器,但猜猜它仍然无法正常工作:P

window.App = App = Em.Application.create({
    ApplicationController: Em.Controller.extend({}),

    ApplicationView: Em.View.extend({
        template: Em.Handlebars.compile('{{outlet}}'),
    }),

    ExtendedPatientController: Em.ObjectController.extend({}),

    ExtendedPatientView: Em.View.extend({
        classNames: ['patient-view', 'extended'],
        template: Em.Handlebars.compile('{{name}}')
    }),

    Patient: Em.Object.extend({
        name: undefined,
    }),
});

App.Router.map(function (match) {
  match('/').to('application', function (match) {
    match('/').to('extendedPatient');
  })
});

App.deferReadiness();

App.ExtendedPatientRoute = Em.Route.extend({
  setupController: function (controller) {
    controller.set('', App.Patient.create({
      name: "Bert"
    }));
  },
  renderTemplates: function () {
    this.render('extendedPatient', {
      into: 'application'
    });
  }
});

App.advanceReadiness();
4

2 回答 2

3

实际上,您在这里做的工作比您需要做的要多得多。

这是使示例工作所需的所有代码。

模板:

<script type="text/x-handlebars" data-template-name="index">
  <div class="patient-view extended">
    <p>Name: {{name}}</p>
  </div>
</script>

应用程序:

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

App.Patient = Em.Object.extend({
  name: null
});

App.IndexRoute = Em.Route.extend({
  model: function() {
    return App.Patient.create({
      name: "Bert"
    });
  }
});

工作小提琴位于:http: //jsfiddle.net/NXA2S/23/

让我解释一下:

  • 当您前往 时/,您正在进入自动index路线。要在屏幕上显示该路线的内容,您需要做的就是实现一个index模板。当您启动并运行时,最简单的方法是将您的模板放入您的index.html. 稍后,您可能会想要使用构建工具(有关更多信息,请参阅我的答案)。
  • model您可以通过覆盖路由处理程序中的钩子来控制在路由模板中显示的模型。在 的情况下index,路由处理程序是App.IndexRoute。在这种情况下,模型是全新的App.Patient

您可能想要实现控制器和事件。您可以在 Ember.js 网站上了解有关路由器的更多信息

于 2013-01-11T07:12:21.263 回答
0

所以新路由器确实解决了这个问题,并且感觉有点光亮。

我终于找到了如何做这个基本示例,这就是路由器中发生的事情:

App.Router.map(function (match) {
  match('/').to('extendedPatient');
});

这需要在视图中发生:

ExtendedPatientView: Em.View.extend({
    classNames: ['patient-view', 'extended'],
    //You need to specify the defaultTemplate because you extend the view class
    //instead on initializing it.
    defaultTemplate: Em.Handlebars.compile('{{name}}')
}),

您不必推迟新路由器修复的应用程序中的准备情况。

在路由中你不需要指定,renderTemplates所以路由器现在看起来像:

App.ExtendedPatientRoute = Em.Route.extend({
  setupController: function (controller) {
    controller.set('content', App.Patient.create({
      name: "Bert"
    }));
  },
});

http://jsfiddle.net/NXA2S/28/

于 2013-01-10T17:25:50.310 回答