angular ui router - AngularJs ui-route "could not resolve state" error -
im new angularjs , i'm trying ui-route working no luck. snippet of .js file containing route configure.
//object routing var route = angular.module('route', ["ui.router"]) // configure routing route.config(function($stateprovider, $urlrouterprovider) { // send profile page $urlrouterprovider.otherwise("/personal_info"); $stateprovider // route personal info .state('personal_info', { url: "/personal_info", templateurl : 'personal_info.html' , controller : 'perscontroller' }) });
and html file try inject ui-veiw , implement nav bar routing.
<!doctype html> <html ng-app='app'> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="cache-control" content="no-cache, no-store, must-revalidate, pre-check=0, post-check=0, max-age=0" /> <meta http-equiv="pragma" content="no-cache" /> <meta http-equiv="expires" content="0" /> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.8/angular.min.js"> </script> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.8/angular-resource.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.10.0/ui-bootstrap-tpls.min.js"></script> <script src="client_ui.js"></script> <script src="angular.js"></script> <script src="//angular-ui.github.io/ui-router/release/angular-ui-router.js"></script> <link href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet" media="screen"> <link rel = "stylesheet" type="text/css" href="css/bootstrap.css"> <link rel = "stylesheet" type="text/css" href="css/mycss.css"> </head> <body> <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> <script src="js/bootstrap.js"></script><!-- navigation bar --> <div class="navbar-header"> <a class="brand" ui-sref="#">home</a> <ul class="nav nav-pills"> <li><a class="active" ui-sref="personal_info">personal info</a></li> <li><a ui-sref="cog_health">cognitive health</a></li> <li><a ui-sref="gen_health">general health</a></li> </ul> </div> <div class="container"> <div ui-view></div> </div> </div> </body> </html>
i'm getting error says "error: not resolve 'peronal_info' state '' transitionto@http://angular-ui.github.io/ui-router/release/angular-ui-router.js:1971 ...". can please give me hint on how fix problem?
thanks
update: i've fixed syntax problem , i'm getting error looks ,
"get http://localhost:3000/personal_info.html [http/1.1 401 unauthorized 1ms]"
here's example of app.js ui-router.
'use strict'; angular.module('srcapp', [ 'ngcookies', 'ngresource', 'ngsanitize', 'ui.router' ]) .config(function ($stateprovider, $urlrouterprovider, $locationprovider) { $stateprovider .state('lang', { url: '/:lang', templateurl: '../views/interface.html', controller:'mainctrl' }); $locationprovider.html5mode(true).hashprefix('!'); $urlrouterprovider.when('/', '/en'); $urlrouterprovider.otherwise('/en'); });
i'd suggest trying yours like:
//object routing var app = angular.module('app', ["ui.router"]); // configure routing app.config(function($stateprovider, $urlrouterprovider) { $stateprovider // route personal info .state('index', { url: "/personal_info", templateurl : 'personal_info.html' , controller : 'perscontroller' }); // send profile page $urlrouterprovider.otherwise("/personal_info"); });
Comments
Post a Comment