AngularJS state provider is not working

Question

var app = angular.module("myApp", ['ui.router']).
config(['$stateProvider', function ($stateProvider) {    
    $stateProvider.state('login', {                             
                              url: '/login',
                              templateUrl: '/templates/LoginPage.html',
                              controller: 'loginController'                     
                         });
    }]);
app.controller("homePageController", function ($scope, $state) {
var self = this;
$scope.isLoginError = false;
$scope.loginSuccess = false;
$scope.validateCredentials = function () {
if ($scope.userName != '' && $scope.passWord != '') {                
     $scope.loginSuccess = true;
     $scope.isLoginError = false;
    // $location.url('/login');
     $state.go('login');
            }
            else {                
                $scope.isLoginError = true;
            }
        }
});

// This is my angularJS code and when a state gets changed http://localhost:44212/templates/homePage.html#!/login I am getting ! in the URL and it's not navigating to other views.

Can anyone please help me out to solve this problem.

Thanks in advance.

Possible duplicate of [Exclamation mark after hash (#!) in angularjs app](https://stackoverflow.com/questions/41214312/exclamation-mark-after-hash-in-angularjs-app) and [URL hash-bang (#!/) prefix](https://stackoverflow.com/questions/41226122/url-hash-bang-prefix-instead-of-simple-hash-in-angular-1-6) — Kyle Krzeski, Jun 26 '17 at 12:46
Now I not getting ! after adding $locationProvider.hashPrefix(''); adding this. Now the url is like this http://localhost:44212/templates/homePage.html#/login. Still it is not navigating to specified view. — Nandha, Jun 26 '17 at 13:07
That ! in url issue has solved. State gets changes in Url but specified template is not getting loaded. — Nandha, Jun 26 '17 at 13:30

score 0 · Answer 1 · answered Jun 26 '17 at 14:23

Are you getting any errors? Based on what you provided here it should work. I created a working plnk for you to compare your code to.

http://plnkr.co/edit/5AuB8qAtuttP4p6m3ZIY?p=preview

The only real thing I added was:

$stateProvider.state('home', {
  url: '/',
  templateUrl: 'HomePage.html',
  controller: 'homePageController'
});

$urlRouterProvider.otherwise('/');

and

app.controller("loginController", function($scope, $state) {
    console.log('loginController loaded');
});

AngularJS state provider is not working

1 Answers1