Question

我的Ionic应用程序中有一个手风琴列表，如下所示：

我的路线如下：

.state('tab.plan', {
      url: '/plan',
       resolve: {
        authenticated: ['djangoAuth', function(djangoAuth){
          return djangoAuth.authenticationStatus();
        }],
      },
      views: {
        'tab-plan': {
          templateUrl: '/templates/tab-plan.html', <= view responsible for this list
          controller: 'planCtrl'
        }
      },
      cache: false
    })

  .state('tab.exerciseTest', {
      url: '/plan/2',          <= hardcoding exerciseId as a trial, must be optimized 
       resolve: {
        authenticated: ['djangoAuth', function(djangoAuth){
          return djangoAuth.authenticationStatus();
        }],
      },
      views: {
        'tab-plan': {
          templateUrl: '/templates/template1.html',
          controller: 'template1Ctrl'
        }
      },
       cache: false
    })

    .state('tab.exercise', {
      url: '/plan/:exerciseId', 
       resolve: {
        authenticated: ['djangoAuth', function(djangoAuth){
          return djangoAuth.authenticationStatus();
        }],
      },
      views: {
        'tab-plan': {
          templateUrl: '/templates/video.html', <= For physical exercises
          controller: 'videoCtrl'
        }
      },
       cache: false
    })

此列表共有12个元素（即练习），当我点击任何元素时，它会打开练习页面。

然而，这些元素有两种类型：练习1（ieBest Stretch），3,5,7,9,11,12是体育练习，它们有单一的HTML和一个共同的逻辑（即video.html，videoCtrl ）并且基于从列表中传递为stateParam的exerciseId到videoCtrl（即1,3,5,7,9,11,12），将为不同的练习填充相应的模型值。

摘自手风琴名单的模板：

<a class="item item-icon-left item-accordion" ng-show="isGroupShown(day)" ng-repeat="exercise in day.exercises" type="item-text-wrap"
   href="#/tab/plan/{{exercise.id}}">
  {{exercise.name}}        
</a>

然而，所有其他练习（即2,4,6,8,10）都是记忆游戏，它们都有不同的逻辑，因此有不同的HTML。

现在例如当我点击 Simon游戏时，我处理导航以加载页面：

.state('tab.exerciseTest', {
          url: '/plan/2', //:dayId/:exerciseId
           resolve: {
            authenticated: ['djangoAuth', function(djangoAuth){
              return djangoAuth.authenticationStatus();
            }],
          },
          views: {
            'tab-plan': {
              templateUrl: '/templates/template1.html',
              controller: 'template1Ctrl'
            }
          },
           cache: false
        })

这里我将exerciseId值硬编码为2，然后将其绑定到特定模板和控制器。这是有效的，但我将遇到的问题是为所有剩余的内存游戏手动执行相同的操作并且它似乎不是最佳的。

我如何以及在何处构建一个逻辑，该逻辑将根据exerciseId，使用哪个模板和控制器来决定？是否有可能在路线中实施这样的事情？

Angularjs路线优化

0 个答案: