Menu
I'm having a problem in AngularJS routing and controllers. Here is the code:
Index.html
<!DOCTYPE html>
<html ng-app="contacts">
<head>
<script src="libs/angular.min%20(1).js"></script>
<script src="contacts.js"></script>
<script src="index.js"></script>
<title></title>
</head>
<body >
<div data-ng-view=""></div>
</body>
</html>
index.js
var myApp = angular.module('contacts', []);
myApp.config(function ($routeProvider) {
$routeProvider
.when('/', { controller: 'ContactsCtrl', templateUrl: '/views/show-contacts.html' })
//.when('/view2', { controller: 'MyCont', templateUrl: 'V2.htm' })
.otherwise({ redirectTo: '/' });
});
contacts.js
var myApp = angular.module('contacts', []);
myApp.controller('ContactsCtrl', function ($scope) {
$scope.name = "omar";
});
but I'm getting this error:
Argument 'ContactsCtrl' is not a function, got undefined
Any help?
826
Change your index.html like this;
<script src="index.js"></script>
<script src="contacts.js"></script>
And in your contact.js change
var myApp = angular.module('contacts', []); to
var myApp = angular.module('contacts');
Angular module with two arguments like angular.module('contacts', []); will create a new module, but angular module with single argument like angular.module('contacts'); will pick up the existing module. Here in this case 'contacts'
161
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
