Question

我试图将一些名称从firebase加载到我的列表视图，然后当我点击任何项目时，它会在下一个视图中使用firebase中的自动生成的id显示相应名称的名称。这是我的代码：

controllers.js：

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

.controller('ListCtrl', function($scope, UserService) {
  var listAllUsers=function(){
    UserService.listAll().then(function(users){
        $scope.list=users;
    });
  }

  listAllUsers();
})

.controller('DetailCtrl', function($scope, $stateParams, UserService) {

    UserService.listById($stateParams.listId).then(function(user){
      $scope.user=user;
    });
    console.log($stateParams.listId);


});

services.js：

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

.factory('UserService', function($q, $firebaseArray) {

    var ref = new Firebase('https://list-detail-001.firebaseIO.com/users')

    var Users=$firebaseArray(ref);

    return {
        listAll:function(){
            var deferred=$q.defer();
            deferred.resolve(Users);
            return deferred.promise;
        },

        listById:function(userId){
            var deferred=$q.defer();
            var user=Users[userId];
            deferred.resolve(user);
            return deferred.promise;
        }
    };
});

list.html：

<ion-view view-title="Lists">
  <ion-content>
    <ion-list>
      <ion-item ng-repeat="listitem in list" href="#/{{listitem.$id}}">
        {{listitem.title}}
      </ion-item>
    </ion-list>
  </ion-content>
</ion-view>

detail.html：

<ion-view view-title="Details">
  <ion-content>
    <h1>{{user.title}}</h1>
  </ion-content>
</ion-view>

如您所见，该应用程序非常简单。如果它在一个简单的json数组中，数据可以工作，但我似乎无法获取详细信息页面来显示user.title属性。我可能错过了一些非常简单的事情。有人可以帮忙吗？我猜测我的代码中的问题与我的services.js中的listById（）函数或我的controller.js中的DetailCtrl有关。但我不知道是什么。我在$ stateParams.listId参数中从我的数据库中获取了正确的ID，但是从那里开始，我的$ scope.users是未定义的。请帮忙！

Answer 1

好的，我解决了这个问题。现在一切正常。我想保留承诺，因为我有点偏执，我不想要一个我的数据很大的情况，我的UI因此受到影响。

controllers.js：

.controller('ListCtrl', function($scope, UserService) {
  var listAllUsers=function(){
    UserService.listAll().then(function(users){
        $scope.list=users;
    });
  }

  listAllUsers();
})

.controller('DetailCtrl', function($scope, $stateParams, UserService) {

    UserService.listById($stateParams.listId).then(function(user){
      $scope.user=user;
    });
});

services.js

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

.factory('UserService', function($q, $firebaseArray,$firebaseObject) {

    var ref = new Firebase('https://list-detail-001.firebaseIO.com/users')

    var Users=$firebaseArray(ref);

    return {
        listAll:function(){
            var deferred=$q.defer();
            deferred.resolve(Users);
            return deferred.promise;
        },

        listById:function(key){
            var deferred=$q.defer();
            var userRef= ref.child(key);
            var user=$firebaseObject(userRef);
            deferred.resolve(user);
            return deferred.promise;
        }
    };
});

带有firebase自动生成id的角度列表详细信息视图

1 个答案: