javascript - 在 application.create() 之外创建时将数据加载到 ember 路由器的根路由中

标签 javascript ember.js

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

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

而且我似乎无法摆脱这样一种感觉,即您“应该”以不同的方式来做。

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

编辑:

显然我有点忽略了 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();

最佳答案

实际上,您所做的工作很多比您需要做的要多。

以下是使您的示例正常工作所需的所有代码。

模板:

<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"
    });
  }
});

工作 fiddle 位于:http://jsfiddle.net/NXA2S/23/

让我稍微解释一下:

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

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

关于javascript - 在 application.create() 之外创建时将数据加载到 ember 路由器的根路由中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14254210/

相关文章:

javascript - 如何使用 ng-class 在值计算为空时删除类

javascript - 如何从另一个组件 "hide/show" "Expandable Item"组件(类星体)

ember.js - 读取 Handlebars 模板中的对象属性

javascript - 无法在 emberjs 的 View 中建模

javascript - 使用没有模板脚本标签的 ember.js

javascript - 使用文件系统包读取文件

javascript - Underscore js 中的模板错误

javascript - document.write() 有什么错误吗?

javascript - 对于EmberJs模型,为什么建议不要重写 `init`方法

javascript - 如何使用带有文本框的模板,其中加载了从 ember.js 中的调用模板传递的数据