Question

我在tomcat中配置了一个小角度应用程序，它的工作正常，但是当我尝试使用route-Provider时它无法正常工作。我无法找到我的观点。我不知道为什么？

任何人都可以举一些小例子。

我的代码文件

//this is controllers.js
var myapp = angular.module('sampleapp', []);
myapp.config('$routeProvider',function myRoute($routeProvider) {
    $routeProvider.
    when('/', {
        templateUrl: 'partials/admin.html',
        controller: 'adminController'
      })
      when('/showdata', {
          templateUrl: 'partials/data-view.html',
          controller: 'dataController'
        }).
      otherwise({
        redirectTo: '/'
      });
  });


adminController = function ($scope) {
    $scope.message = "Welcome to Login Page";
}

dataController = function ($scope) {
    $scope.message = "Welcome to Show Data Page";
}

myapp.controller(controllers)

我的index.html

<html>
<base href="/advangularjs/" />
<head>
<link type="text/css" rel="stylesheet" href="css/default.css">
<script src="js/angular.js"></script>
<script src="js/angular-route.js"></script>
<script src="demoweb_angular/controllers.js"></script>

</head>
<body ng-app="sampleapp" style="background-color: #E0EEE0">

<a href="#"> Login </a> |
<a href="showdata"> Show Data </a>

<div ng-view align="center" style="border: 1px solid red;">

</div>
</body>
</html>

admin.html

<b>{{ message }}</b>

数据view.html

<b>{{ message }}</b>

Answer 1

确保添加了angular-route.js 在index.html文件中。

另外请查看ui路由器的文档以进行基本设置

Answer 2

var myapp = angular.module('sampleapp', ['ngRoute']);

您还需要添加ngRoute依赖性。因为sampleapp取决于ngRoute。

<div ng-view></div>

你还需要添加它。部分正在加载到这个div。把它放在body。

中

在tomcat中配置具有多个视图的angularjs应用程序

2 个答案: