I have a situation here. I have used angularJS for my application and also using $resource for service call. Now i want to implement a new functionality in this. In this i need to show a checkbox for which i have a code in index.html and i need to load the services conditionally. but i am not specifying ng-app in this. I want my application to behave as angular from the second page which i am redirecting from index. Is it possible to do? If yes can anyone help me please?
Here is the sample code which i have tried but am stuck:
Index.html
<body>
<div>
<table style="margin-left:40%">
<td style="width:62%">
<label id="sampleEnv" style="margin-top:10%">First Login</label>
</td>
<td>
<div class="onoffswitch">
<input type="checkbox" name="onoffswitch" class="onoffswitch-checkbox" id="myonoffswitch">
<label class="onoffswitch-label" for="myonoffswitch">
<span class="onoffswitch-inner"></span>
<span class="onoffswitch-switch"></span>
</label>
</div>
</td>
</tr>
</table>
<input type="button" value="submit" onclick="checkVal()">
</div>
<script>
function onclick(){
alert(document.getElementById("myonoffswitch").checked);
location.href="views/login.html";
}
</script>
</body>
Login.html
<html ng-app="sampleApp">
<head>
</head>
<body ng-controller="sampleController">
<form name="sampleForm" ng-submit="authenticate()" novalidate>
<div>
<table align="center">
<tr>
<td>ID</td>
<td> <input name="sampleId" type="text" maxlength="9" ng-model="sampleIdModel" integer/></td>
</tr>
<tr>
<td>Password</td>
<td><input type="password" name="password" ng-model="password" passwordmin /></td>
</tr>
</table>
</div>
</form>
</div>
</body>
</html>
App.js
var app = angular.module("sampleApp", ["sampleService"]);
After clicking on the submit button on index page, login page comes but fully distorted. After debugging in chrome, i found that login.html doesn't have any support from any other controller or js which was loaded in index.html .
Any help will be very useful. Thanks in advance.
