Configure angularjs app in tomcat with multiple views

Question

I configured a small angular app in tomcat its working fine, but when i tried to use route-Provider its not working. I cannot route to my views. I did not know why ?

Can any one give some small example for that.

My Code files

//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)

my 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>

data-view.html

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

yes i had tried a very simple example but still I cant find it working — Harshit Thacker, Oct 15 '14 at 11:15
I posted my code can you please have a sight on it for any corrections — Harshit Thacker, Oct 15 '14 at 11:48

score 0 · Answer 1 · answered Oct 15 '14 at 11:16

0

Make sure you have added angular-route.js in your index.html file.

Also Please go through the documentation of ui router for the basic setup

answered Oct 15 '14 at 11:16

forgottofly

2,729
11
51
93

I had posted my code can you please find problems in it, if any – Harshit Thacker Oct 15 '14 at 11:49
Still i am finding solution for this question, can you help me ? – Harshit Thacker Oct 28 '14 at 07:03

Kalhan.Toress · Answer 2 · 2014-10-15T11:55:53.683

0

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

u need to add ngRoute dependancy also. Because your sampleapp is depend on ngRoute .

<div ng-view></div>

you need to add this also. the partial are loading to this div. put this inside the body.

edited Oct 15 '14 at 11:55

answered Oct 15 '14 at 11:49

Kalhan.Toress

21,683
8
68
92

its one and the same thing what i did and you are trying to say the last update is not useful at all. – Harshit Thacker Oct 15 '14 at 12:00
Still i am finding solution for this question, can you help me ? – Harshit Thacker Oct 28 '14 at 07:03
can you please create a plunker demo – Kalhan.Toress Oct 28 '14 at 07:05
its working in plunker but not when i configure that in apache tomcat as a web application – Harshit Thacker Oct 29 '14 at 06:37
are you using `$locationProvider.html5Mode(true);` ? – Kalhan.Toress Oct 29 '14 at 06:42
nope i dint use html5Mode but any ways thanks for helping me to solve this issue. I found the solution, you answers were relevant but i was having some different issue. – Harshit Thacker Dec 24 '14 at 11:15

Configure angularjs app in tomcat with multiple views

2 Answers2