angularjs routing在我的示例示例中不起作用

时间:2017-03-06 12:21:47

标签: angularjs

我正在尝试运行angularjs路由示例但无法运行。         以下是代码段。         // Main.html
                                                 

        <body ng-app="myApp">

        <p><a href="#/">Main</a></p>

        <a href="#london">City 1</a>
        <a href="#paris">City 2</a>

        <p>Click on the links to read about London and Paris.</p>

        <div ng-view></div>

        <script>
        var app = angular.module("myApp", ["ngRoute"]);
        app.config(function($routeProvider) {
            $routeProvider
            .when("/", {
                templateUrl : "main.html"
            })
            .when("/london", {
                templateUrl : "london.html"
            })
            .when("/paris", {
                templateUrl : "paris.html"
            });
        });
        </script>

        </body>
        </html>

london.html

        <h1>London</h1>
        <h3>London is the capital city of England.</h3>
        <p>It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.</p>
        <p>{{msg}}</p>

paris.html

    <h1>Paris</h1>
    <h3>Paris is the capital city of France.</h3>
    <p>Th`enter code here`e Paris area is one of the largest population centers in Europe, with more than 12 million inhabitants.</p>
    <p>{{msg}}</p>

请帮我运行这个例子。

提前致谢。

2 个答案:

答案 0 :(得分:0)

观察您的评论,我相信这篇文章可以解决您的问题:

Allow Google Chrome to use XMLHttpRequest to load a URL from a local file

顺便说一句,确保在angularJs脚本之后加载ngRoute脚本。

答案 1 :(得分:0)

确保获取Angular路由j并在index.html中添加对它的引用

<script src="scripts/angular-route.js"></script>