Question

说我在app_component.html中有这个简单的脚手架：

<header>
    <div>
        <!-- here I have some elements that won't change -->
    </div>
    <div>
        <!-- SECTION HEADER: but I want to change this part's content, based on
             navigation or something else (auth roles, for example) -->
    </div>
</header>

<main>
    <div class="container">
        <div class="row">
            <div class="col s12">
                <section class="section">
                    <router-outlet>
                        <!-- SECTION MAIN: main content goes here -->
                    </router-outlet>
                </section>
            </div>
        </div>
    </div>
</main>
<div class="divider"></div>
<footer>
    <div>
        some footer here. nothing important
    </div>
</footer>

正如您在代码段中所看到的，我在 SECTION MAIN 中使用<router-outlet>来显示正常的内容。问题是，如何在标题部分（代码中的 SECTION HEADER ）中有一个可更改的部分，以及如何根据标题更改内容？导航，身份验证角色等？ AngularDart是否支持此类路由？提前致谢。

Answer 1

简短的回答是否定的，路由器目前不支持这样做。

其他框架通过＆＃34;命名＆＃34;支持此功能。路由器插座。这允许多个出口存在于同一视图中，前提是它们具有唯一的名称。然后，每个路径配置必须指定在哪个命名插座中呈现哪个组件。如果这听起来合乎需要，请随时提交功能请求：https://github.com/dart-lang/angular

当然，你总能编写自己的解决方案。您可以为标题部分创建一个组件，动态加载不同的组件，具体取决于哪个路由处于活动状态。它只需要注入Router并收听Router.stream路由更改。

AngularDart：如何根据导航更改布局的部分部分？

1 个答案: