Question

我已检查过angularfire上的文档以检索和显示数据，但我遇到了问题！我想我正在返回数据，但我没有显示它。这是我的plnker的链接：http://plnkr.co/edit/LZ24sRoSJjuCHQnEGzQz?p=preview

索引

      <h1 ng-repeat="group in data.groups">{{group.name}}</h1>

JS

      $scope.newGroup = {
        name: '',
        status: ''
      };

      $scope.addGroup = function(newGroup) {

        groupsService.addGroup(newGroup);

        $scope.newGroup = {
            name: '',
            status: ''
        };

      };

    .factory('groupsService', ['$firebase', 'FIREBASE_URI',
      function ($firebase, FIREBASE_URI) {
        var ref = new Firebase(FIREBASE_URI);

        var groups = $firebase(ref).$asArray();

        var getGroups = function(){
          return groups;
        };

        var addGroup = function (newGroup) {
          console.log(newGroup)
          groups.$add(newGroup);
        };

        return {
          getGroups: getGroups,
          addGroup: addGroup,

        }

Answer 1

plunkr中的视图不包含ng-repeat标记。但是，如果我添加这些片段，它会按预期工作。

在控制器中，您需要将数组添加到范围：

$scope.data = {};
$scope.data.groups = groupsService.getGroups();

然后在视图中，循环遍历绑定控制器的元素内的组：

<form ng-controller="MainCtrl">
  <h1 ng-repeat="group in data.groups">{{group.name}}</h1>
</form>

输出

喜

喜

dfgdfg

更新了plunkr：http://plnkr.co/edit/HWZj5szozMMBXGadu2U6?p=preview

从firebase中提取数据并在页面上显示

1 个答案: