1

まず第一に、私は Ionic の初心者です。会社の POC として、最初のアプリを作成しています。iPhone で Ionic View を使用して、モバイル デバイスでどのように表示されるかを確認しています。

私が直面している問題は、私の携帯電話で、メニューの 1 つのレベルにいるときに、アプリがそれ以上ナビゲートしたくないように見えることです。ただし、ブラウザ（私の開発環境）では問題なく動作しています。私が見逃しているものはありますか？

私が問題を抱えているビューは次のようになります。

<ion-view view-title="About Us">
  <ion-content>
    <ion-list>
      <ion-item ng-repeat="aboutus in aboutuspage" href="{{aboutus.url}}" >
        {{aboutus.title}}
      </ion-item>
    </ion-list>
  </ion-content>
</ion-view>

アバウトアスはどこですか

.controller('AboutUsCtrl', function($scope) {
  $scope.aboutuspage = [
    { title: 'What is NYDA?', url: '#/app/aboutus/whatisnyda' },
    { title: 'NYDA Board', url: '#/app/aboutus/nydaboard' },
    { title: 'NYDA Executive Managers', url: '#/app/aboutus/nydaexecutivemanagers' },
    { title: 'NYDA Strategy', url: '#/app/aboutus/nydastrategy' },
    { title: 'Youth Employment Accord', url: '#/app/aboutus/youthemploymentaccord' }
  ];
})

メニューのルートで [About Us] ビューを選択すると、[About Us] ビューが表示されます。aboutuspage次に、配列によって記述されたビューのリストを取得します。

app.js次のように my でルートを指定します。

.state('app.aboutus', {
    url: "/aboutus",
    views: {
      'menuContent': {
        templateUrl: "templates/aboutus.html",
        controller: 'AboutUsCtrl'
      }
    }
  })    

  .state('app.aboutus_whatisnyda', {
    url: "/aboutus/whatisnyda",
    views: {
      'menuContent': {
        templateUrl: "templates/aboutus/whatisnyda.html",
          controller: 'AboutUsCtrl'
      }
    }
  })

  .state('app.aboutus_nydaboard', {
    url: "/aboutus/nydaboard",
    views: {
      'menuContent': {
        templateUrl: "templates/aboutus/nydaboard.html",
          controller: 'AboutUsCtrl'
      }
    }
  })

  .state('app.aboutus_nydaexecutivemanagers', {
    url: "/aboutus/nydaexecutivemanagers",
    views: {
      'menuContent': {
        templateUrl: "templates/aboutus/nydaexecutivemanagers.html",
          controller: 'AboutUsCtrl'
      }
    }
  })

  .state('app.aboutus_youthemploymentaccord', {
    url: "/aboutus/youthemploymentaccord",
    views: {
      'menuContent': {
        templateUrl: "templates/aboutus/youthemploymentaccord.html",
          controller: 'AboutUsCtrl'
      }
    }
  })

  .state('app.aboutus_nydastrategy', {
    url: "/aboutus/nydastrategy",
    views: {
      'menuContent': {
        templateUrl: "templates/aboutus/nydastrategy.html",
          controller: 'AboutUsCtrl'
      }
    }
  })

最後に、(単純化された) フォルダー構造は次のようになります。

+-- project
+---- www
+------ templates
+-------- aboutus.html
+-------- AboutUs
+---------- NYDABoard.html
+---------- NYDAExecutiveManagers.html
+---------- NYDAStrategy.html
+---------- WhatISNYDA.html
+---------- YouthEmploymentAccord.html

これらの各ビューは、現時点では純粋なテキスト コンテンツです。また、メニューのルートには他に 2 つのビューがあり (そこから分岐するビューはこれ以上ありません)、これらも純粋なテキストであり、問​​題なくナビゲートできます。

4

1 に答える 1