.js not getting applied on ng-view
Question
I have the index.html with ng-view inside. I have imported respective .js file to the index.html but those .js not getting applied on injected view.
index.html
<!DOCTYPE html>
<html class="no-js css-menubar" lang="en" >
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<head>
<title>gg</title>
<!-- Scripts -->
<script src="js/userdat.js"></script>
</head>
<body class="dashboard site-menubar-push" ng-app="app">
<h1>Header</h1>
<ng-view></ng-view>
<script src="assets/js/jquery-1.9.1.js"></script>
<script src="assets/js/jquery.mobile-1.4.2.js"></script>
<!-- AngularJS Angular-route -->
<!--Angular linking -->
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.6/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.6/angular-route.min.js">
</script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.6/angular-resource.js">
</script>
</body>
</html>
The line <script src="js/userdat.js"></script> has jQuery stuff and it loads perfectly but the logic return in it not working on ng-view injected ui elements.if i import it in partials it works fine but not stable, Do you know How can I import it properly.
partials.html
<script src="js/userdat.js"></script>
<div class="jumbotron text-center">
<h1>Home Page 4 Life</h1>
<p>hi</p>
</div>
2 answers
solution1
1 ACCPTED 2016-02-10 12:04:55
Either place all the CDN includes (jquery, angular, ...) in the <head> element or place the the userdat.js at the bottom of the <body> .
Note that you if you're accessing DOM elements with JQuery that are injected into the ng-view , you'll need to listen to $routeChangeSuccess events because the html is modified after an angular digest.
solution2
0 2016-02-10 11:54:06
The best way to do this would be using RequireJS, but it's going to be pretty tough if your project is already big.
With RequireJS you could even add a resolve to the route:
resolve: {
userdat: function($q) {
var deferred = $q.defer();
require(['./js/userdat.js'], function(userdat) {
deferred.resolve(userdat);
});
return deferred;
}
}
If implementing RequireJS is too hard, I would just hardcode the code into the view.
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.