Question

我刚刚开始调整示例角度/离子选项卡导航应用程序并遇到了问题。当我点击一个视图中的链接（所有旅程列表）时，我应该进入一个屏幕，其中包含有关该特定旅程的详细信息。（改编自示例应用中的“聊天”。然而，它并没有完全奏效。 URL更改为预期的URL，但视图/页面根本不会更改。当我尝试刷新页面时，我将恢复到默认状态/页面。

控制器是：

.controller('JourneysController', function($scope, $log, JourneyHandler) {
  'use strict';

  $log.debug('Activating the journey controller');

  $scope.journeys = JourneyHandler.getJourneys();
})

.controller('JourneyDetailController', function($scope, $stateParams, $log) {
  'use strict';

  $log.debug('Activating the journey detail controller');

  $scope.journey = {
    journeyId: 0,
    journeyStart: new Date()
    };
})

app.js将状态定义为：

.state('tab.journeys', {
  url: '/journeys',
  views: {
    'tab-journeys': {
      templateUrl: 'templates/tab-journeys.html',
      controller: 'JourneysController'
    }
  }
})

.state('tab.journey-detail', {
  url: '/journey',
  views: {
    'tab-journey-detail': {
      templateUrl: 'templates/journey-detail.html',
      controller: 'JourneyDetailController'
    }
  }
});

$urlRouterProvider.otherwise('/tab/dash');

以及相关的模板是： 制表journeys.html

<ion-view view-title="My Journeys">
<ion-content>
<ion-list>
  <ion-item class="item-remove-animate item-avatar item-icon-right" ng-repeat="journey in journeys" type="item-text-wrap" href="#/tab/journey">
    <h2>{{journey.journeyId}}</h2>
    <p>{{journey.routeId}}</p>
    <i class="icon ion-chevron-right icon-accessory"></i>

    <ion-option-button class="button-assertive">
      Delete
    </ion-option-button>
  </ion-item>
</ion-list>
</ion-content>
</ion-view>

和 journey-detail.html

<ion-view view-title="Journey Detail">
<ion-content>
<p>This is where the journey details will go.</p>
</ion-content>
</ion-view>

控制台中没有错误，所以我真的不明白为什么它不起作用。

Answer 1

当我遇到同样的问题时，我发现错误的发生是因为控制器没有加载。

在状态声明中注释控制器并查看它是否有效。您需要检查控制器。

Angular Router - Url更改但视图未加载

1 个答案: