0

私の Ionic アプリには、子状態のページ「order.html」があります。このページに他の 2 つのページ ("orderheaderdetail.html" と "orderitemdetail.html") を読み込むようにしたいと考えています。「ui-view」を定義して、他の 2 つのページ (「orderheaderdetail」と「orderitemdetail」など) をロードしました。これが正しい習慣かどうかはわかりません。しかし、うまくいかないようです。ページ「A」のhtmlは次のとおりです。

 <ion-view title="Order">
    <div ng-controller="OrderDetailController">
        <ion-content>
            <div layout="row">
                <div class="panel" flex="70" flex="100" flex-sm="70">
                    <div class="panel" flex="90">
                        <div ui-view="orderheaderdetail">
                        </div>
                        <div ui-view="orderitemdetail">
                        </div>
                    </div>
                </div>
            </div>
        </ion-content>
    </div>
</ion-view>

ルーティングコードは次のとおりです。

 .state('protected.order', {
            url: '/order/:_id/',
            views : {
                'menuContent' : {
                        templateUrl: 'templates/order.html',
                        controller: 'OrderDetailController'
                },

                'orderheaderdetail' : {
                        templateUrl: 'templates/orderheaderdetail.html',
                        controller: 'OrderDetailController'
                },
                'orderitemdetail' : {
                        templateUrl: 'templates/orderitemdetail.html',
                        controller: 'OrderDetailController'
                },             
            }
        })

「order.html」は子状態でなければならないため、状態を抽象に変更できません。つまり、基本的には、他の子ステートを持つ子ステートのようなものです。これを解決する方法はありますか？ありがとう

4

2 に答える 2

0

読み込まれる ui ビューの状態をもう 1 つ定義できます。を使用してそのビューにルーティングする必要があります$state.go('protected.order.detail')。

.state('protected.order', {
        url: '/order/:_id',
        views : {
            'menuContent' : {
                    templateUrl: 'templates/order.html',
                    controller: 'OrderDetailController'
            }            
        }
    })
.state('protected.order.detail', {
       url: '/detail',
       views: {
            'orderheaderdetail' : {
                    templateUrl: 'templates/orderheaderdetail.html',
                    controller: 'OrderDetailController'
            },
            'orderitemdetail' : {
                    templateUrl: 'templates/orderitemdetail.html',
                    controller: 'OrderDetailController'
            } 
       }
})
于 2016-10-01T06:38:05.993 に答える
0

子ビューは、次の@ような参照で定義する必要があります

            'orderheaderdetail@protected.order' : {
                    templateUrl: 'templates/orderheaderdetail.html',
                    controller: 'OrderDetailController'
            },
            'orderitemdetail@protected.order' : {
                    templateUrl: 'templates/orderitemdetail.html',
                    controller: 'OrderDetailController'
            },

そうあるべきかどうかはわかりませorderitemdetail@protected@orderんorderitemdetail@protected.order。したがって、両方を試してみてください

于 2016-10-01T06:39:19.593 に答える