同一 div 中的多个 ng-repeat

Question

我几乎在这里找到了答案 ()，我只需要一点帮助。

我正在尝试使用 ng-repeat 在同一个 div 中显示多个值。我遵循了上面 link 中的回答，尽管我不知道要在 $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 会被值覆盖。这就是为什么你不能正确地获得价值。

但是如果你想要 data 和 value，你可以使用不同的键在对象中分配。

同一 div 中的多个 ng-repeat

Multiple ng-repeat in the same div

html

javascript

angularjs

angularjs-ng-repeat