Question

我在Ionic App中使用Rest JSON Web服务。我正在使用标签和Master-Detail页面。在主页面中，我查看项目列表。当我尝试显示特定项目的详细信息页面时，数据不会出现。请帮忙。

这是我的代码：

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方法返回一个promise，就像all方法一样，所以在NjoftimDetailCtrl控制器中你应该解决这个问题（就像你在{{{ 1}}）。

NjoftimetCtrl

（也许您必须使用.controller('NjoftimDetailCtrl', function($scope, $stateParams, Njoftimet) { Njoftimet.get($stateParams.njoftimId).success(function (response) { $scope.njoftim = response; }); });代替response.data）

Ionic：详细信息页面不显示带有标签模板和Json的Master-Detail模式中的数据

1 个答案: