stateprovider在切換頁面時不起作用

Question

在我的程序中，我要在登錄頁面中按登錄按鈕后加載programsetup html頁面。

登錄頁面的myconfig函數如下

 .config(function config($stateProvider) {
$stateProvider.state('login', {
    url: '/login',
    views: {
        "main": {
            controller: 'LoginCtrl',
            templateUrl: 'login/login.tpl.html'
        }
    },
    data: {
        pageTitle: 'Login'
    }
    });
 })

登錄頁面加載成功！ 但是單擊“登錄”按鈕后未加載程序設置頁面

$location.href = "#/programsetup";

這是我在登錄.js中用於加載程序設置頁面的行，我的programsetup配置函數為：

  .config(function config($stateProvider) {
    $stateProvider.state('programsetup', {
    url: '/programsetup',
    views: {
        "main": {
            controller: 'ProgramSetupCtrl',
            templateUrl: 'programsetup/programsetup.tpl.html'
        }
    },
    data: {
        pageTitle: 'Program Setup'
    }
   });
 })

我在做什么錯？ 請幫幫我。

Answer 1

在您的login.js文件中（在登錄控制器內部），您需要編寫ng-click方法並添加以下代碼

$state.go("programsetup");

而且$ state需要在控制器中添加依賴項注入

Answer 2

只需在根.config內為programsetup配置狀態。 然后進行按鈕登錄。 用戶$state.go('programsetup')轉到該頁面。

粗略的HTML：

<button class="button button-positive" ng-click="login()">Go Programsetup</button>

然后在配置和控制器中。

.config(function config($stateProvider) {
         $stateProvider.state('login', {
             url: '/login',
             views: {
                 "main": {
                     controller: 'LoginCtrl',
                     templateUrl: 'login/login.tpl.html'
                 }
             },
             data: {
                 pageTitle: 'Login'
             }
         });

         $stateProvider.state('programsetup', {
             url: '/programsetup',
             views: {
                 "main": {
                     controller: 'ProgramSetupCtrl',
                     templateUrl: 'programsetup/programsetup.tpl.html'
                 }
             },
             data: {
                 pageTitle: 'Program Setup'
             }
         });
     })


     .controller('LoginCtrl', function($scope, $state) {
             $scope.login = function() {
                 $state.go('programsetup');
             }

         })
         .controller('ProgramSetupCtrl', function($scope) {
             alert('i am at Program setup page.');
         })