在 emberjs 中，我的应用程序已经有使用 application.hbs 模板的路由模板，但现在我想创建一个不使用 application.hbs 的新路由模板。
有什么简单的解决办法吗？
我看到了很多答案，但这与我的规范不符，而且我的 ember 版本是 2.11。
谢谢。
【问题讨论】：
标签： templates ember.js routes overriding
尽可能让 application.hbs 在所有路由中保持最小和通用。您应该做的是为您的应用程序生成顶级路由。
假设您有一个通用设置，其中有一个经过身份验证的部分、登录后和登录部分。登录前和登录后具有不同的顶级模板是很常见的。试试这样的：
ember g 路由登录 ember g 路由登录/索引 ember g 路由登录/忘记密码 ember g 路由已通过身份验证 ember g 路由认证/索引 ember g 路由已验证/配置文件 等等……
您的 login.hbs 将具有自己的样式，并且可能具有子路由，它们将采用该样式并将后续嵌套模板放置在其他人提到的 {{outlet}} 中。
文件结构：
routes/
-login/
----index.hbs
----forgot-password.hbs
-authenticated/
----index.hbs
----profile.hbs
login.hbs
authenticated.hbs
application.hbs
在上面的示例中，login.hbs 可能如下所示：
{{yellow-navbar}}
{{outlet}}
和这样的authenticated.hbs：
{{pink-navbar}}
{{user.name}}
{{outlet}}
现在，login/index.hbs 和 login/forgot-password.hbs 模板将在 login.hbs 出口中呈现。这两个页面都会呈现一个黄色的导航栏，然后是它们自己的内容。
因为 authenticated.hbs 是另一个顶级父路由，authenticated/index.hbs 和 authenticated/profile.hbs 都会在粉红色的导航栏下方呈现它们的内容并显示当前用户的姓名。
如果您的 application.hbs 看起来像这样：
{{#general-site-container}}
<h2>Website Name</h2>
{{outlet}}
{{/general-site-container}}
那么所有的路由，无论是认证的还是登录的，都将在 general-site-container 中，并且都将显示带有网站名称的 h2。
这里有一个重要的提示，我看到很多人对此感到困惑，那就是这个文件夹结构并不决定路由的实际路径。
路由器可以这样配置，以避免在 url 中显示“authenticated”： Router.js
// login.index route assumed at root url /login
this.route('login', { path: '/login' }, function() {
// avail at /login/forgot-password
this.route('forgot-password', { path: '/forgot-password' }
});
//authenticated.index.hbs assumed at root avail at /
//notice that the authenticated parent route has a route of "/"
this.route('authenticated', { path: '/' }, function() {
// authenticated.profile route avail at /profile
this.route('profile', { path: '/profile' });
// as an exmaple you can further nest content to your desire
// if for instance your profile personal info section has a parent
// template/route
this.route('', { path: '/personal-info' }, function() {
this.route('address', { path: '/address' }); //profile/personal-info/address
});
});
【讨论】：
我认为您需要使用{{outlet}} 来实现此目的。
通过覆盖应用程序模板创建不同的出口，您需要在其中显示不同的模板
{{outlet}} //application hbs default one
{{outlet "view1"}} // another template
{{outlet "view2"}} //another template
应该有view1.hbs 和view2.hbs 以呈现这些模板
【讨论】：