在angularfire中从firebase读取数据

时间:2015-06-25 13:27:24

标签: angularjs angularfire

我有一个应用程序,我需要将艺术家及其详细信息存储在数据库中。现在我想要检索所有艺术家并在前端渲染他们的一些细节。如何做到这一点。 其次,如果我通过使用ng-model在某些输入字段中获得艺术家评级,那么如何将该值存储在特定艺术家中以更新细节。 数据库结构是:

{
    "artists": {
        "Atif":{
            "name":"atif",
            "rating":8
        },
        "Himesh":{
            "name":"himesh",
            "rating":5
        }
    }
}

这是angular.js

(function()
  {

var app = angular.module("myapp", ["firebase"]);

app.controller("maincontroller", function($scope, $firebaseObject,$firebaseArray)
{
  var ref = new Firebase("https://gigstart.firebaseio.com/");

  var artists=ref.child("artists");


  // download the data into a local object
  $scope.data = $firebaseObject(ref);

  // putting a console.log here won't work, see below
    ref.on("value", function(snapshot)
    {
      console.log(snapshot.val());
    }, function (errorObject) 
    {
      console.log("The read failed: " + errorObject.code);
    });


   var artistsRef=new Firebase("https://gigstart.firebaseio.com//artists");




}); //end of controller

现在我想在前端渲染每个艺术家的名字和等级。我可以做类似

的事情
<div ng-repeat="artist in artists">
    {{artist.name}}
    {{artist.rating}}
</div>

1 个答案:

答案 0 :(得分:2)

您有一个艺术家列表,您希望在Angular视图中ng-repeat结束。你可以通过以下方式实现这一目标:

app.controller("maincontroller", function($scope, $firebaseArray)
{
  var ref = new Firebase("https://gigstart.firebaseio.com/");    

  var artists = ref.child("artists");

  $scope.artists = new $firebaseArray(artists);
}

在开始您自己的项目之前,请花点时间浏览AngularFire快速入门。这包含在step 5