html - angularJS in templateUrl can't call function -
i'm using angular make page identification before access app main, in templateurl: login.html cant !
note: when called ng-app="myapp" give error : uncaught error: [$injector:modulerr]
here code js:
angular.module('training') .config(function($routeprovider){ $routeprovider .when('/',{ templateurl: 'index.html', controller: 'mainctrl' }) .when('/login',{ templateurl: 'login.html', controller: 'logincrtl' }); }) .controller('logincrtl',['$scope','$timeout','apiservice','$routeprovider', function($scope,$timeout,apiservice,$routeprovider){ $scope.ppp= function(){ alert('ok'); } }]) .controller('mainctrl'...... here login.html
<!doctype html> <html> <head> <title></title> <script src="public/jquery-1.11.2.min.js"></script> <script src="public/jquery-ui.js"></script> <script src="bower_components/angular/angular.min.js"></script> <!-- <script src="bower_components/angular-route/angular-route.min.js"></script> --> <script src="controllers/app.js"></script> <script src="services/apiservice.js"></script> <script src="controllers/maincrtl.js"></script> </head> <body ng-controller="logincrtl"> <div class="center" style="width: 500px; height: 300px; background-color: #e5e5e5;"> veuillez authentifier:<br><br> login: <input type="text" id="login"><br><br> password: <input type="text" id="pass"> <br><br> <button id="validaccess" ng-click="ppp()">ok</button> </div> </body> <style > .center { margin: auto; width: 60%; border: 3px solid #73ad21; padding: 10px; } </style> </html> my index.html:
<!doctype html> <html lang="fr"> <head> <meta charset="utf-8"> <title>planni</title> <link rel="stylesheet" type="text/css" href="mystyle/bootstrap-tokenfield.css"> <link rel="stylesheet" type="text/css" href="mystyle/bootstrap.min.css"> <link rel="stylesheet" href="mystyle/bootstrap-datepicker.css"> <link rel="stylesheet" href="mystyle/jquery-ui.css"> <script src="public/jquery-1.11.2.min.js"></script> <script src="public/jquery-ui.js"></script> <script src="public/bootstrap-datepicker.js"></script> <script src="node_modules/lodash/lodash.js"></script> <script src="bower_components/angular/angular.min.js"></script> <script src="bower_components/angular-route/angular-route.min.js"></script> <script src="bower_components/moment/min/moment-with-locales.min.js"></script> <script src="public/daypilot/daypilot-all.min.js"></script> <script src="public/bootstrap-tokenfield.js"></script> <script src="public/bootstrap.min.js"></script> <!-- <script src="bower_components/angular-route/angular-route.js"></script> --> <script src="controllers/app.js"></script> <script src="services/apiservice.js"></script> <script src="controllers/maincrtl.js"></script> </head> <body data-ng-app="training" data-ng-controller="mainctrl"> .... </body> </html>
where ng-app ? module of training call ng-app ='training' not ng-app='myapp' promblem of not setting use
angular.module('training',['ngroute'])
here set module
angular.module('training',[])
and here module
angular.module('training')
edit
you use this
angular.module('training',['ngroute']) .controller('mainctrl',mainctrl) .controller('loginctrl',loginctrl) function mainctrl(){ // } function loginctrl(){ // } or if have module contain loginctr use this
angular.module('anothermodule',[]) .controller('loginctrl',loginctrl) function loginctrl(){ // } and in training app include
angular.module('training',['ngroute','anothermodule'])
Comments
Post a Comment