Ionic：详细信息页面不显示带有选项卡模板和 Json 的主从模式中的数据

Question

我正在 Ionic 应用程序中使用 Rest JSON 网络服务。我正在使用选项卡和主从页面。在母版页中，我查看了项目列表。当我尝试显示特定项目的详细信息页面时，数据没有出现。请帮忙。

这是我的代码：

service.js

angular.module('starter.services', [])

.factory('Njoftimet', function($http) {

  return{
    all: function(){
      return $http.get('url')
    },

    get: function (njoftimId) {
      return $http.get('url'+ njoftimId)
    }
  }; 
});

controllers.js

angular.module('starter.controllers', [])

.controller('DashCtrl', function($scope) {})

.controller('NjoftimetCtrl', function($scope, Njoftimet){

  Njoftimet.all().success(function (response) {
    $scope.njoftimet = response;
  })

  $scope.doRefresh = function(){
     Njoftimet.all().success(function (response) {
   $scope.njoftimet = response;
  })
   $scope.$broadcast('scroll.refreshComplete');
 };
})

.controller('NjoftimDetailCtrl', function($scope, $stateParams, Njoftimet) {  

   $scope.njoftim = Njoftimet.get($stateParams.njoftimId);
});

app.js

.config(function($stateProvider, $urlRouterProvider) {

   $stateProvider

     .state('tab', {
     url: '/tab',
     abstract: true,
     templateUrl: 'templates/tabs.html'
   })

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

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

   .state('tab.njoftim-detail', {
      url: '/njoftimet/:njoftimId',
      views: {
      'tab-njoftimet': {
       templateUrl: 'templates/njoftim-detail.html',
       controller: 'NjoftimDetailCtrl'
      }
     }
   })

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

 })

  .config(function($ionicConfigProvider) {
   $ionicConfigProvider.tabs.position('bottom');
})

tab-njoftimet.html（大师）

<ion-view>
 <ion-nav-bar class="bar-assertive">
  </ion-nav-bar>
   <ion-content>
    <ion-refresher on-refresh="doRefresh()"></ion-refresher>
     <ion-list>
      <ion-item class="item item-icon-right" ng-repeat="njoftim in njoftimet" type="item-text-wrap" href="#/tab/njoftimet/{{njoftim.id}}">    
       <h2>{{njoftim.title}}</h2>
       <p>{{njoftim.content}}</p>    
       <i class="icon ion-chevron-right icon-accessory"></i>    
     </ion-item>
    </ion-list>
   </ion-content>
  </ion-view>

njoftim-detail.html（详细信息）

<ion-view>
<ion-nav-bar class="bar-assertive">
  <ion-nav-back-button>
  </ion-nav-back-button>
</ion-nav-bar>
<ion-content class="padding">  
  <h2>{{njoftim.title}}</h2>
  <p>{{njoftim.content}}</p>
</ion-content>
</ion-view>

Answer 1

服务上的 get 方法 returns 一个承诺，就像 all 方法一样，所以在 NjoftimDetailCtrl 控制器中你应该解析承诺（就像你在里面做 NjoftimetCtrl).

.controller('NjoftimDetailCtrl', function($scope, $stateParams, Njoftimet) {  

    Njoftimet.get($stateParams.njoftimId).success(function (response) {
        $scope.njoftim = response;
    });

});

（也许你必须使用 response.data 而不是 response）

Ionic：详细信息页面不显示带有选项卡模板和 Json 的主从模式中的数据

Ionic: Detail page doesn't show data in Master-Detail pattern with tabs template and Json

json

rest

ionic-framework

tabs

master-detail