Question

我发布了我的代码，请问代码中有什么错误。当我点击锚标签＆＃34;联系人＆＃34;它不会改变视图...... 我已经定义了单独的控制器。

先谢谢......）：

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Test</title>
    <script src="scripts/angular.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular-route.js"> </script>
    <!--<script src="scripts/angular-route.js"></script>-->
    <script src="js/app.js">enter code here</script>
</head>
<body ng-app="myModule">
<h1>Welcome to ITYX</h1>
    <p><a href="#main">Home</a></p>
    <p><a href="#contact">Contact</a></p>
    <div ng-view></div>
</body>
</html>

app.js

var app =angular.module("myModule",['ngRoute']);
app.config(['$routeProvider',function($routeProvider){
    $routeProvider.
        when('/',{
            templateUrl:'templates/main.html',
            controller:'mainController'
    }).
    when('/contact',{
        templateUrl:'templates/contact.html',
         controller:'contactController'
    }).
    otherwise({
        redirectTo:'/'
    });
}]);
app.controller('mainController',function($scope){
    $scope.message ="hi am in main section";
});
    app.controller('contactController',function($scope){
        console.log("contact controller");
    $scope.message ="hi am in contact section";
});

main.html中

<h1>Main Section</h1>
{{message}}

contact.html

<h1>Contact Section</h1>
{{message}}

Answer 1

你需要把它作为，

 <div class="container">
    <div class="row">
      <div class="col-sm-12">
        <h1>Welcome to ITYX</h1>
        <div class="nav">
          <a href="#main" class="button">Main</a>
          <a href="#contact" class="button">Contact</a>
        </div>
      </div>
    </div>
  </div>

<强> DEMO

Answer 2

它必须是您的文件或角度的路径。如果您正确引用文件，我已经让一个plunker来验证您的代码是否有效。
Plunker implementation of your code
唯一不同的是：

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular-route.js"></script>

ng-route无效

2 个答案: