angularjs - Is there something like initialize module once in angular? -


can have loading data once in angular module? tried use .run() gets called whenever page accessed. example: there 2 html pages belonging same module:

testpage1.html: <html ng-app="myapp"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <script src="js/angular.min.js"></script> <script src="js/jquery-1.8.2.js"></script> <script src="js/app.js"></script> </head> <body>     <p><a ng-href="testpage2.html">go page2</a></p> </body> </html>  testpage2.html: <html ng-app="myapp"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <script src="js/angular.min.js"></script> <script src="js/jquery-1.8.2.js"></script> <script src="js/app.js"></script> </head> <body>     <p><a ng-href="testpage1.html">go page1</a></p> </body> </html>  app.js: var myapp = angular.module('myapp', []); var cnt = 0; myapp.run(['$rootscope', '$http', function(scope, $http) { if(scope.loggedin == undefined || scope.loggedin == null) {     $http.get('rest/userdata').success(function(data) {         cnt++;         alert(cnt);         scope.loggedin = true; }); } }]); 

when navigate 1 page .run() getting called again , again cnt 1. possible have called once in life- time of module getting initialized? or other way?

it seems missing basics such controller. typical angular setup having ng-view app , loading other pages via routing. here simple example:

http://beta.plnkr.co/edit/rnzwewxtjfri49bvw50v?p=preview

app.js

var app = angular.module('myapp', []).   config(['$routeprovider', function($routeprovider) {     $routeprovider.when('/view1', {templateurl: 'testpage1.html', controller: page1ctrl});     $routeprovider.when('/view2', {templateurl: 'testpage2.html', controller: page2ctrl});      $routeprovider.otherwise({redirectto: '/view1'});   }]).run(function () { // instance-injector      alert('only run on first page load load data or whatever 1 time');  // runs 1 time   })   function mainctrl($scope) {   $scope.name = 'main'; }  function page1ctrl($scope) {   $scope.name = 'page 1'; }  function page2ctrl($scope) {   $scope.name = 'page 2'; } 

html:

<html ng-app="myapp" > <head>   <meta charset="utf-8">   <title>angularjs plunker</title>   <link rel="stylesheet" href="style.css">   <script>document.write("<base href=\"" + document.location + "\" />");</script>   <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js"></script>   <script src="app.js"></script> </head> <body ng-controller="mainctrl">   main page. main nav:     <a ng-href="#/view1">go page1</a>&nbsp;&nbsp;     <a ng-href="#/view2">go page2</a>  <div ng-view></div> </body> </html> 

you notice in html there ng-view, when route encountered such #/view routeprovider looks , provides correct template , calls appropriate controller. believe kind of setup trying achieve.


Popular posts from this blog

How to calculate SNR of signals in MATLAB? -

c# - Attempting to upload to FTP: System.Net.WebException: System error -

ios - UISlider customization: how to properly add shadow to custom knob image -