Firebase检索数据仅显示一个结果

时间:2015-03-08 17:54:04

标签: angularjs

我正在尝试检索对象数据,结果显示在控制台上,但它只显示页面上的一个结果(最后一个结果)。

$http.get('/users').success(function(data) {
        $scope.username = data; //assign data to username
        console.log(data);
});

在我的Jade模板中,我有

section(data-ng-controller='browse')
h4 hi
ul(data-ng-repeat='user in username')
li {{user}}

我想循环浏览这些数据

 {
  "google: xxxxxxxxxxxxx" : {
    "name" : "ZZZ YYY",
    "profile" : {
      "briefProfile" : "Cost call",
      "career" : "Web Developer",
      "projects" : {
        "-JjtSgiwkqFxTxMv0Gip" : "http://zipper.com"
      }
    },
    "provider" : "google"
  },
  "google:xxxxxxxxxxx" : {
    "name" : "SSS TTT",
    "profile" : {
      "briefProfile" : "Desired Intelligence",
      "career" : "Consultant"
    },
    "provider" : "google"
  }
}

谢谢。(我不使用angularFire)。

2 个答案:

答案 0 :(得分:1)

如果你正在使用AngularFire,你应该看看这个:

而不是使用$ http.get尝试:

var data = $firebaseArray(new Firebase("URL"));
$scope.data = data;

不要忘记在控制器中添加$ firebaseArray作为依赖项。

有关AngularFire文档的更多信息: https://www.firebase.com/docs/web/libraries/angular/api.html#angularfire-firebasearray

如果你没有使用AngularFire,请看一下:

var firebaseRef = new Firebase('YOUR-FIREBASE-URL/users/');
firebaseRef.on('value', function(dataSnapshot) {
    var data = dataSnapshot.val();
    console.log(data);
    $scope.users = data;

    // Might need to use $digest to update $scope.
    $scope.$digest();
});

有关Firebase文档中on()的更多信息: https://www.firebase.com/docs/web/api/query/on.html

答案 1 :(得分:1)

如果您使用的是$http服务,则说明您没有使用Firebase。

  1. 您正在重复ul而不是li。此外,{{user}}将是整个用户对象,您将在页面上看到[Object object]而不是字符串。所以请致电{{user.name}}

    ul
    li(data-ng-repeat='user in users') {{user.name}}
    
  2. 假设$http出现错误,而您打算使用Firebase,则可能需要先查看Firebase Getting Started guide

    // Get a reference to users
    var ref = new Firebase('https://<YOUR-FIREBASE>.firebaseio.com/users');
    
    // Attach an asynchronous callback to read the data at users ref
    ref.on("value", function(snapshot) {
      console.log(snapshot.val());
      $scope.users = snapshot.val();
    }, function (errorObject) {
      console.log("The read failed: " + errorObject.code);
    });
    
相关问题