Question

我几乎在这里找到了答案（Multiple ng-repeat on single element），我只需要一些帮助。

我正在尝试使用ng-repeat在同一个div中显示多个值。我按照上面链接中的回答，虽然我不知道放在$ scope中的内容。到目前为止没有任何显示。

这是我的JS：

    var app = angular.module('test', []);

app.controller('MainCtrl', function($scope) {
    var database = firebase.database();
    database.ref(`trips/${userid}/trips`).once('value') 


.then(photosSnap => {
    var photosObj = photosSnap.val();
    var tripName = Object.keys(photosObj).map(key => photosObj[key].name);
    var tripPhotoUrl = Object.keys(photosObj).map(key => photosObj[key].photourl);

 this.repeatData = tripName.map(function(value, index) {
return {
    data: value,
    value: tripPhotoUrl[index]
}
});

    $scope.repeatData = data;
    $scope.repeatData = value;

    $scope.$apply();

    console.log($scope);
}).catch(err => alert(err));

     });

我的HTML：

 <div class="main" ng-app="test" ng-controller="MainCtrl">

    <div id="usertripinfo" ng-repeat="data in repeatData" style="background-image: url({{data.value}}); height: 300px; width: 600px;">

     {{data.data}}

    </div>

 </div>

Answer 1

将结果分配给$scope.repeatData会使其在html文件中显示为repeatData，请尝试以下操作：

var app = angular.module('test', []);

  app.controller('MainCtrl', function ($scope) {
    var database = firebase.database();
    database.ref(`trips/${userid}/trips`).once('value')


      .then(photosSnap => {
        var photosObj = photosSnap.val();
        var tripName = Object.keys(photosObj).map(key => photosObj[key].name);
        var tripPhotoUrl = Object.keys(photosObj).map(key => photosObj[key].photourl);

        $scope.repeatData = tripName.map(function (value, index) {
          return {
            data: value,
            value: tripPhotoUrl[index]
          }
        });
      }).catch(err => alert(err));
  });

Answer 2

   $scope.repeatData = data;
   $scope.repeatData = value;

我认为通过这样做 repeatData 会被值覆盖。这就是你无法正确获得价值的原因。

但是如果你想要数据以及值，你可以使用不同的键在对象中分配。

在同一个div中进行多次ng-repeat

2 个答案: