Hi I am fairly new to angular and i have just started my first app with it.Here is what I have done so far.This is my index file:
<body ng-app="codeArt">
<div ng-controller="loginCtrl">
<ng-include src="/App/scripts/login/login.html"></ng-include>
</div>
<!-------------- Angular Libs ---------------------->
<script src="/App/libs/angular/angular.js"></script>
<!--------------- Code Art Main Module -------------->
<script src="/App/scripts/codeArt.js"></script>
<!--------------- Code Art Login Module -------------->
<script src="/App/scripts/login/login.js"></script>
</body>
The index file is stored in Views/Home/Index.cshtml. This will be the only file stored here and it is needed because I used ASP.NET MVC.
I defined my main module in App/scripts/codeArt.js:
var codeArt = angular.module("codeArt", [
'codeArt.login'
]);
I then created an aditional module that will contain functionalities related to login and registration App/scripts/login/login.js
var login = angular.module('codeArt.login', [])
I defined a controller in App/scripts/login/controllers/loginCtrl.js:
login.controller('loginCtrl', function($scope){
$scope.name = "Nistor Alexandru";
$scope.clicked = function(){
alert("I was clicked");
}
});
I also defined the main view for the login page in App/scripts/login/login.html and it lookslike this:
<section>
<div>{{name}}</div>
<button ng-click="clicked()">Clicked Alert!</button>
</section>
As it can be seen from my index.cshtml file I tryed using the ng-include to load the login.html file.For some reason when I run the app I can only find a comment that says ng-include: undefined and the html is not loaded.
I wil be integrating routing at some point but for now I want to understand why this is not working correctly?
I have also tryed this path ../../App/scripts/login/login.html asuming it will lok for files relaive to index.cshtml file but that was not the case.