I have an issue were my routing is not populating my view.
I have the following code running from an Xampp local server:
angular 1.4.9
index.html:
<html>
<head>
<script src="scripts/angular.js" type="javascript/text"></script>
<script src="scripts/Ng-Route.js" type="javascript/text"></script>
<script src="scripts/app.js" type="javascript/text"></script>
</head>
<body ng-app="myApp">
<div ng-view></div>
</body>
</html>
user.html:
<div>
<fieldset>
Hello, {{ctrl.message}}
</fieldset>
</div>
app.js:
var app = angular.module('myApp', ['ngRoute']);
app.config(function($routeProvider) {
$routeProvider
.when('/', {
templateUrl : 'user.html',
controller : 'controller as ctrl'
});
$routeProvider.otherwise({ redirectTo: '/' });
});
app.controller('controller', function() {
var self = this;
self.message = 'Everyone';
});
I have absolutely no clue why this is failing, nothing shows up on the page. I am expecting "Hello, Everyone".
Any help would appreciated.
You had mistaken declaring your controller on your route. controller
does accept controller name in string
/ controller function
. And use controllerAs
option to alias your controller.
$routeProvider
.when('/', {
templateUrl : 'user.html',
controller : 'controller',
controllerAs: 'ctrl'
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.