I am having a problem with an AngularJS app/site. I have an index.html file with the following:
<!DOCTYPE html>
<html ng-controller="Basicontroller" ng-app="myApp" >
<head>
<script src="js/angular.js"></script>
<script src="js/angular-route.js"></script>
<script type="text/javascript" src="modules/myModule.js" ></script>
<script type="text/javascript" src="modules/controllers.js" >
</script>
<title ng-view>
</title>
</head>
<body>
<div ng-view >
</div>
</body>
</html>
My myModule.js file is the following:
var ciqApp = angular.module('myApp',[
'ngRoute',
'myController'
]);
ciqApp.config(['$routeProvider',
function($routeProvider){
$routeProvider.
when('/home',{
templateUrl:'/Paul/partials/basic-template.html',
controller:'Basicontroller'
}).
otherwise({
redirectTo: '/home'
});
}]);
function MainController($scope){
}
function Basicontroller($scope){
$scope.title = 'this is the title';
$scope.body = 'Welcome...';
}
My controller.js file is as follows:
var myController = angular.module('myController', []);
myController.controller('Basicontroller', ['$scope', '$http',
function ($scope, $http) {
$http.get('/paul/Index.html#/home').success(function(data) {
$scope.home = data;
});
}]);
My basic-template.html file is:
<h1>{{title}}</h1>
<h4>{{body}} </h4>
The index.html page is in a folder called 'Paul' by the way. When Index.html loads it should have a title with "this is the title' and the body should say "Welcome" (as these are assigned by the
$scope variable). I am not getting any errors in the javascript console. When I write some text into 'basic-template.html' it displays it in Index.html so the partial page is loading but the function I am assigning to the controller (Basicontroller) is not.
I would appreciate any replies.
