3

私は Angular + material-uiを使用しています。基本的には、さまざまな手順でオンボーディング プロセスを実行したいので、それぞれ異なる .tabs ディレクティブを使用していますui-view。

HTML:

<div ng-controller="TabsCtrl" class="content" ng-show="$root.loadingComplete">
    <md-tabs md-selected="$root.selectedIndex" md-border-bottom class="md-primary">
        <md-tab id="tab1" md-on-select="goTo('start')">
            <md-tab-label>Welcome</md-tab-label>
            <md-tab-template>
                <md-content>
                    <div ui-view="vStart"></div>
                </md-content>
            </md-tab-template>
        </md-tab>
        <md-tab id="tab2" md-on-select="goTo('personal')">
            <md-tab-label>Personal</md-tab-label>
            <md-tab-template>
                <md-content>
                    <div ui-view="vPersonal"></div>
                </md-content>
            </md-tab-template>
        </md-tab>

これは私のルート設定です:

angular.module('onboarding').config(['$stateProvider', '$urlRouterProvider',
    function($stateProvider, $urlRouterProvider) {
        $stateProvider
            .state('start', {
                url: '/:memberId',
                views: {
                    vStart: {
                        templateUrl: 'views/start.html',
                        controller: 'StartCtrl'
                    }
                }
            })
            .state('personal', {
                url: '/:memberId/personal',
                views: {
                    vPersonal: {
                        templateUrl: 'views/personal.html',
                        controller: 'PersonalCtrl'
                    }
                }
            })
           ...

関数 goTo(ステータス):

$scope.goTo = function(state) {
            $state.transitionTo(state, $stateParams);
        };

問題は主に、URLで「ホーム」を開くとlocalhost:9000/#/12345正常に機能し、スタートビューが表示され、個人用ビューに切り替えることができることです

$rootScope.selectedIndex = 1;
$state.transitionTo('personal', $stateParams);

しかし、何も起こっていない状態で直接 URL を開くlocalhost:9000/#/12345/personalと、ビューが読み込まれず、コントローラーも読み込まれません。それらがロードされたときに確認する必要がありますconsole.log('start controller')。console.log('personal controller')

また、ブラウザの履歴が機能していません。たとえば、スタートページにlocahost:9000/#/12345移動してボタンをクリックすると、 localhost:9000/#/12345/personalすべて問題ありませんが、ブラウザの履歴に戻ると、URL はlocalhost:9000/#/1245(正しい) ですが、ビューは完全に空です。コントローラーはまったくロードされていません。

4

1 に答える 1

0

ルーティングがオフになっているようです。UI-router は、サブステートの URL をその親ステートに追加します。

見出しを削除してみてください/:memberId:

.state('personal', {
    url: '/personal',
        views: {
            vPersonal: {
                templateUrl: 'views/personal.html',
                controller: 'PersonalCtrl'
             }
         }
})
于 2015-05-26T16:00:02.213 に答える