gpt4 book ai didi

javascript - 如何使用 Ember js 在一个页面中显示多个路由?

转载 作者:行者123 更新时间:2023-11-28 00:51:12 24 4
gpt4 key购买 nike

我是 Ember 的新手,我遇到了一个我无法解决的问题。我有两条路线——家和 lhstree。调用/home 时,我需要渲染两条路线。 lhstree 应该在主页模板中呈现。为此,我使用了名为 outlet 的名称。效果很好。但问题是,我需要向 lhstree 模板提供数据。但是永远不会调用 lhstree 模板的模型 Hook 。我什至尝试在模型 Hook 中添加警报消息,但也从未执行过。下面是我的代码。感谢您的帮助。

路由器.js:

Router.map(function() {
this.route('home');
this.route('lhstree');
});

home.hbs:

<html>
<head>
</head>
<body>
Home hbs rendering
{{outlet 'lhstree'}}
</body>
</html>

home.js:

export default Route.extend({
renderTemplate:function()
{
this.render();
this.render('lhstree',{outlet:'lhstree',into:'home'});
}
});

lhstree.hbs:

<ul>
{{#each model as |player|}}
<li>{{player}}</li>
{{/each}}
</ul>

lhstree.js:

model() //THIS MODEL IS NEVER CALLED
{
return ['Player1', 'Player2'];
}

正如我提到的,永远不会调用 lhstree 路由的模型 Hook 。因此,渲染主页模板时,玩家名称 Player1 和 Player2 永远不会显示。

最佳答案

有两种不同的方法来解决这个问题:

  1. 如果 lhstree 总是在主页上,请不要为它使用路由。您可以将其构建为组件,并将属性从父级向下传递给它(因此在 Home 模型路由中获取 lhstree 所需的数据)。所以你的 socket 将被替换为:

    {{lhstree-component model=model.lhsStuff}}
  2. 让 lhstree 成为 Home 的子路由。这样,当有人去 home/lhstree 时,Ember 会将 lhstree 模板渲染到 Home 模板内的 socket 中,并将调用两个模型。为此,请像这样设置您的路线:

    Router.map(function() {
    this.route('home', function() {
    this.route('lhstree');
    });
    });

关于javascript - 如何使用 Ember js 在一个页面中显示多个路由?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47269783/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com