javascript - 模板中的 Angular 模板

标签 javascript angularjs templates single-page-application partials

看看我能否在这里描述我的设置...

我正在设计一个 Angular 应用程序，截至目前，所有内容都在一页上。基本上，当用户点击一个按钮时， Controller 设置哪个

"<ng-include>"

标签可见。所以我的 html 看起来像这样。

<html ng-app= "myApp">
    <head>
        <!-- header stuff -->
        <!-- all the includes and everything -->
    </head>

    <body>
        <div>
            <!-- page nav bar, its a lot of html but it works -->
        </div>

        <!-- content area -->
        <div ng-show= "showHome">
            <ng-include= "home.html">
        </div>
        <div ng-show= "showProfile">
            <ng-include= "profile.html">
        </div>
        <!-- etc... -->

    </body>
</html>

然后在我的 Controller 中，我只是根据需要设置正确的“showHome”、“showProfile”等。我的问题是，这似乎是一种糟糕的扩展方式，这是我第一次尝试这样的应用程序。

所以重申一下。我想给用户一个单页应用程序的外观，同时交换 html 模板。有任何想法吗？多个页面都可以，但我想在每个页面的顶部保留相同的导航栏。

最佳答案

我会使用 ui-router相反。

它是 ngRoute 的流行替代品，并且非常好地支持嵌套模板。

关于javascript - 模板中的 Angular 模板，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/25614235/