Question

我正在使用AngularJS创建一个简单的静态网站。我正在将模板上的ng-view路由到不同的html页面，如下所示：

home.html的：

<script type="text/ng-template" id="views/home.html">
    You are in home
</script>

这是我的Index.html：

<!DOCTYPE html>

<html lang="en" ng-app="myApp" >
    <head>
        <meta charset="utf-8">
        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.js"></script>
        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-route.js"></script>
        <script type="text/javascript" src="js/app.js"></script>

        <title>My Website</title>
        <base href="/">
        <meta name="author" content="Me">
    </head>

    <body ng-controller="ContentController">
        <h1>My Website</h1>

        <ul class="main-nav" id="main-nav">
            <li><a href="home"><i class="fa fa-home"></i>Home</li>
            <li><a href="portfolio"><i class="fa fa-comment"></i>Portfolio</li>
            <li><a href="articles"><i class="fa fa-comment"></i>Articles</li>
            <li><a href="books"><i class="fa fa-comment"></i>Books</li>
            <li><a href="about"><i class="fa fa-shield"></i>About Me</li>
        </ul>

        <ng-view></ng-view>

    </body>
</html>

我的路由工作就在我第二次点击每个链接（投资组合，文章......）之后。我第一次点击链接时，控制器被执行，但视图没有显示html内容（即“你在家里”没有出现在我的初始点击上，就在第二次点击之后）。

如果我在index.html文件上写了home.html的内容，那么它在我的初始点击时也能正常工作。但是，我想了解为什么在我第一次点击这些链接时没有正确加载。

你们能帮助我吗？

是否有正确的方法在单独的文件上使用ng-template？或者我应该使用解决方法在第一次点击后重新加载我的ng-template？

谢谢

Answer 1

如果我删除了ng-template，问题就解决了。我将学习更多以了解如何在单独的文件上使用ng-template并将其写在这里。

AngularJS路由未在初始点击时加载ng-template

1 个答案: