javascript - Angularjs 路由在这里不起作用

标签 javascript angularjs

我用了所有可能的方法来解决这个问题,但都失败了。 如果您对了解此问题有任何疑问,请告诉我。 下面是我的代码,检查是否有语法错误。 我已经使用本地 Angular js 文件作为路由并尝试使用 CDN。 但没有什么影响。

Index.html

 <!-- define angular controller -->
 <body  ng-app="mydemo" ng-controller="mainController">
    <ul>
      <li><a href="#"> Home</a></li>
      <li><a href="#about"></i> About</a></li>
      <li><a href="#contact"></i> Contact</a></li>
    </ul>

  <div ng-view></div>

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

Script.js

我使用的是 1.5.7 的 angularjs 版本

     var mydemo = angular.module('mydemo', ['ngRoute']);
      mydemo.config(function($routeProvider) {
        $routeProvider
        .when('/', {
            templateUrl : 'pages/home.html',
            controller  : 'mainController'
        })

        // route for the about page
        .when('/about', {
            templateUrl : 'pages/about.html',
            controller  : 'aboutController'
        })

        // route for the contact page
        .when('/contact', {
            templateUrl : 'pages/contact.html',
            controller  : 'contactController'
        });
});

mydemo.controller('mainController', function($scope) {
    $scope.message = 'Everyone come and see how good I look!';
});

mydemo.controller('aboutController', function($scope) {
    $scope.message = 'Look! I am an about page.';
});

mydemo.controller('contactController', function($scope) {
    $scope.message = 'Contact us! JK. This is just a demo.';
});

最佳答案

而不是

<li><a href="#contact"></i> Contact</a></li>

尝试一下怎么样

<li><a ng-href="#/contact"></i> Contact</a></li>

我认为路由必须完全匹配,其中包括 /

关于javascript - Angularjs 路由在这里不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38397935/

相关文章:

javascript - 如何使用 JavaScript DOM 在 html 中添加 svg?

javascript - 如何打开新窗口并向其中写入数据

javascript - 如何使用javascript在多选中设置选定的选项

angularjs - 选择标签中的空选项字段 - Angular js

javascript - Md-switch 在 ng-repeat 中不起作用

javascript - EJS不渲染

javascript - 将图像 blob 从 Ajax 上传到 Django

javascript - Phonegap 中的解析查询返回错误 100 XMLHTTPRequest 失败

javascript - Angular 错误 : [$injector:modulerr] 1. 4.5

angularjs - 使用 "Transition Rejection( .."stateName', null, "$state.go(' :true});"后出现 {'reload' 错误