EmberJS在application.hbs中显示路由器模型

Question

我正在使用Ember.js，并且试图使我的页面在导航栏下方显示页面的标题。为了使这项工作有效，我尝试使用模型挂钩，并将其显示在application.hbs文件中。

到目前为止，我已经尝试过这种变化：

routes / contact.js

import Route from '@ember/routing/route';

export default class ContactRoute extends Route {
  model() {
    return 'Title of page';
  }
}

templates / application.hbs

<div>
  <NavBar />

  <div class="pageTitle">
    <h2>
      <p>{{@model}}</p>
    </h2>
  </div>

  <div class="body">
    {{outlet}}
  </div>
</div>

我主要尝试在application.hbs中弄乱@ model，例如outlet。@ model。但是所有这些尝试都导致标题为空或模板编译器错误。有人对此有解决方案吗？最好是不涉及jquery的一个？

Answer 1

由于创建了名为contact的新页面（路由），所以页面的UI部分必须位于相应的模板文件中，即templates/contact.hbs和not templates/application.hbs作为[C0 ]文件只能访问templates/contact.hbs

的@model

即，下面的标记必须位于routes/contact.js文件中，并且在访问templates/contact.hbs处的页面时将显示该标记>

http://localhost:4200/contact
此外，请注意，在<div class="pageTitle">
  <h2>
    <p>{{@model}}</p>
  </h2>
</div>
文件中存在的标记将在应用程序模板的templates/contact.hbs处呈现（请参见{{outlet}}）

有关详细参考，请检查此here