2016-05-30 5 views
2

私はAngularJsでウェブアプリケーションをやっていますが、私は$ stateを使ってアプリに旅行しています。ログイン後、私は家に行く(絶対状態 'app.dashboardの状態' app.dashboard.home ')

このページには、別のビュー「費用」(絶対状態 'app.dashboardの状態' app.dashboard.expense ')というボタンがあります。しかし、ボタンをクリックすると、コンソールに次のエラーが表示されます。

$state.go is not a function

なぜですか?

これはルーティングである:

angular.module('app') 
.run(
['$rootScope', '$state', '$stateParams', 
    function($rootScope, $state, $stateParams) { 
    $rootScope.$state = $state; 
    $rootScope.$stateParams = $stateParams; 
    } 
] 
) 
.config(
['$stateProvider', '$urlRouterProvider', 
function($stateProvider, $urlRouterProvider) { 
    $urlRouterProvider 
    .otherwise('/app/authenticating/'); 

    $stateProvider 
    .state('app', { 
     abstract: true, 
     url: '/app', 
     templateUrl: 'common/mainApp.html' 
    }) 

    .state('app.auth', { 
     url: '/authenticating/', 
     templateUrl: 'common/authenticating/authenticating.html', 
     controller: 'authenticatingCtrl', 
     resolve: { 
     deps: ['$ocLazyLoad', 
      function($ocLazyLoad) { 
      return $ocLazyLoad.load({ 
       files: [ 
       'common/authenticating/controllers/authenticatingCtrl.js' 
       ] 
      }).then(function success(args) { 
       console.log('success'); 
       return args; 
      }, function error(err) { 
       console.log(err); 
       return err; 
      }); 
      }] 
     } 
    }) 

    .state('app.dashboard', { 
     abstract: true, 
     url: '/dashboard', 
     templateUrl: 'dashboard/dashboard.html', 
     resolve: { 
     deps: ['$ocLazyLoad', 
      function($ocLazyLoad) { 
      return $ocLazyLoad.load({ 
       files: [ 
       'dashboard/dashboardCtrl.js' 
       ] 
      }).then(function success(args) { 
       console.log('success'); 
       return args; 
      }, function error(err) { 
       console.log(err); 
       return err; 
      }); 
      }] 
     } 
    }) 

    .state('app.dashboard.home', { 
     url: '/home', 
     views: { 
     'content': {templateUrl: 'dashboard/home/home.html'} 
     }, 
     resolve: { 
     deps: ['$ocLazyLoad', 
      function($ocLazyLoad) { 
      return $ocLazyLoad.load({ 
       files: [ 
       'dashboard/home/homeCtrl.js' 
       ] 
      }).then(function success(args) { 
       console.log('success'); 
       return args; 
      }, function error(err) { 
       console.log(err); 
       return err; 
      }); 
      }] 
     } 
    }) 

     .state('app.dashboard.expense', { 
     url: '/newExpenseList', 
     views: { 
      'content': {templateUrl: 'dashboard/expense/new/new.html'} 
     }, 
     resolve: { 
      deps: ['$ocLazyLoad', 
      function($ocLazyLoad) { 
       return $ocLazyLoad.load({ 
       files: [ 
        'dashboard/expense/new/newCtrl.js' 
       ] 
       }).then(function success(args) { 
       console.log('success'); 
       return args; 
       }, function error(err) { 
       console.log(err); 
       return err; 
       }); 
      }] 
     } 
     }) 

}]) 

これはdashboard.htmlある:

<div class="content-wrap" nav-collapse-toggler type="swipe"> 
    <main role="main" > 
     <div class="section-info"> 
      <div class="section-subtitle">{{app.name}}</div> 
     </div> 
      <div id="content" class="content view-animate fade-up" ui-view="content"></div> 
    </main> 
</div> 

これはhomeCtrlある:

'use strict'; 

angular.module('app').controller('HomeCtrl', ['$http', '$scope', '$rootScope', 'toaster', 'GlobalApplicationData', '$log', '$state', '$stateParams', 
    function($http, $scope, $rootScope, GlobalApplicationData, $log, $state, $stateParams) { 
     $scope.goToNewExpenseList = function() { 
     $state.go('app.dashboard.expense'); 
     }; 
    }]); 

これはhome.htmlある:

<div class="container" ng-controller="HomeCtrl"> 
    <div class="form"> 
      <button class="lol" ng-click="goToNewExpenseList()">Go to expense list</button> 
    </div> 
</div> 

答えて

8

問題が間違ったパラメータ配列定義にあり、が関数パラメータと宣言されています。

などが私の神は

['$http', '$scope', '$rootScope', 'toaster', 'GlobalApplicationData', '$log', '$state', '$stateParams', 
// original is missing 4th param 
//function($http, $scope, $rootScope, GlobalApplicationData, $log, $state, $stateParams) 
// here we get $state as $state, because the 4th param will be toaster 
function($http, $scope, $rootScope, toaster, GlobalApplicationData, $log, $state, $stateParams) 
+0

'toaster'を宣言されているが、それは、関数のparamsに欠けている...ので、他のすべてがシフトされ、異なるものを含んで、どのように私は気づいていませんでした。タイムアウトが終わると、私は答えを受け入れてくれてありがとう。再度、感謝します! – panagulis72

+0

それは素晴らしいです;)それらの問題は痛み...;) –

+1

ありがとう! :) – Benobab

関連する問題