CODEWITHSUNDEEP
angularjs
Jackie
Jackie

Reputation: 41

$state.go('XXX') doesn't work in angularJS project

  1. Conditions: AngularJS V1.0.3, Angular-UI-Router V0.2.10
  2. What I want to implement is the index html page will dynamically forward to login html, then click login button, it will re-forward to home page.

  3. Due to my reputation is not enough so I can not attach the images. Here I will attach my demo code. 3.1: index.html 

            <!-- StateProvider -->
        <div ng-controller="demoController">
            <button ng-click="goToHomePage()">Go To Home Page</button>
        </div>

        <!-- Load extra js -->
        <script type="text/javascript" src="js/lib/jquery/jquery-2.1.3.js"></script>
        <script type="text/javascript" src="js/lib/angular/angular.js"></script>
        <script type="text/javascript" src="js/lib/angular/angular-route.js"></script>
        <script type="text/javascript" src="js/lib/angular/angular-sanitize.js"></script>
        <script type="text/javascript" src="js/lib/angular/angular-animate.js"></script>
        <script type="text/javascript" src="js/lib/angular-ui/angular-ui-router.js"></script>

        <script type="text/javascript" src="js/appDemo.js"></script>
        <script type="text/javascript" src="js/service/DemoService.js"></script>
        <script type="text/javascript" src="js/controller/DemoController.js"></script>

    </body>

    3.2: appDemo.js

    var app = angular.module("demo", ['ui.router']);

app.config(['$stateProvider', '$urlRouterProvider', function($stateProvider, $urlRouterProvider) {

//$urlRouterProvider.otherwise("/landing/dashboard");
$urlRouterProvider.otherwise("/login");
//$urlRouterProvider.when('/landing/influencers', '/landing/influencers/dashboard/market-view');

$stateProvider
    .state('home', {
        url: '/home',
        templateUrl: 'view/home.html',
        controller: function(){
            alert("123");
        }
    })

    .state('login', {
        url: '/login',
        templateUrl: 'view/login.html'
    });
}]);

app.run(['$state', function ($state) {
    alert("running...");
    /*$state.transitionTo('home');*/
    $state.go('home');
}]);

    3.3: DemoController.js

    app.controller('demoController', function($scope, $state, demoService){

    $scope.goToHomePage = function(){
        alert('AAA');
        $state.go("home");
    }

});

    When I click the 'Go To Home Page' button, nothing happened but prompted a message 'AAA' which setted in goToHomePage function.

    Any idea how to forward to home page correctly?

    Any suggestion should be highly appreciated.

Upvotes: 3

Views: 253

Answers (1)

Pankaj Parkar
Pankaj Parkar

Reputation: 136134

You have too old version angularjs which is not compatible with angular-ui-roter.

Updating angular script version from 1.0.3 to 1.3.15 will solve you issue.

Upvotes: 1

Related Questions