I am trying some Router functionality below, but I am not getting any output…
<html>
<head>
<title>History Example</title>
<script src="https://code.jquery.com/jquery-2.1.3.min.js" type="text/javascript"></script>
<script src="https://code.angularjs.org/1.6.0-rc.2/angular.min.js" type="text/javascript"></script>
<script src="https://code.angularjs.org/1.5.0-rc.2/angular-route.min.js"></script>
<!-- <script src="js/myApp.js" type="text/javascript"></script>-->
</head>
<body>
<div data-ng-app="demoApp">
<!-- Placeholder for the views -->
<div data-ng-view=""></div>
</div>
<script>
var demoApp = angular.module("demoApp", ["ngRoute"]);
demoApp.config(function($routeProvider){
$routeProvider
.when('/view1',
{
controller: 'simpleController',
templateUrl: 'angular_testing/view1.html'
})
.when('/view2',
{
controller: 'simpleController',
templateUrl: 'angular_testing/view2.html'
})
.otherwise ({ redirectTo: '/view1'});
});
demoApp.controller('simpleController', function($scope) {
$scope.customers =[
{name:'Shahzad',city:'shahjahanpur'},
{name:'Irshad', city:'Lucknow'},
{name:'Shamshad', city:'rampur'}
];
$scope.addCustomer = function(){
$scope.customers.push(
{ name: $scope.newCustomer.name,
city: $scope.newCustomer.city
});
};
});
</script>
</body>
</html>
view1.html
<html>
<body>
<div>
<h2>View 1</h2>
Name :
<br />
<input type="text" data-ng-model="filter.names" />
<ul>
<li data-ng-repeat="cust in customers | filter:filter.names | filter:city | orderBy:'city'"> {{ cust.name | lowercase}} - {{ cust.city | uppercase }}</li>
</ul>
<br />
Customer Name: <br/>
<input type="text" data-ng-model="newCustomer.name" />
<br />
Customer city: <br/>
<input type="text" data-ng-model="newCustomer.city" />
<br />
<button data-ng-click="addCustomer()">Add Customer</button>
</div>
<br />
<a href="#/view2.html" > View 2</a>
</body>
</html>