Question

一个系列的每个文件都有一个＆＃34;房间＆＃34;属性。我试图从集合中显示每个房间以及与每个房间相关的植物数量。结果将是＆＃34;房间1,6，植物; 2室，2室;等＆＃34。第一个http请求成功获得了一个＆＃34;房间＆＃34;来自＆＃34; plantList＆＃34;中所有文档的值收集并在index.html中显示它。在ng-repeat的每次迭代中，它将消除＆＃34;房间1＆＃34;，＆＃34;房间2＆＃34;等等。然后我使用该值作为url参数传递给＆＃34; getplantsbyroom＆＃34; http请求，如果我在控制台中记录它，它会提供我需要的信息 - 它会告诉我每个房间的植物数量。问题是当我在$ scope.count中显示响应时，计数完全相同 - 它们都反映了请求的最后一个房间 - 这显然是不正确的，而不是控制台显示的结果。所以我认为问题在于ng-repeat正在“植物”中产生物体。比http请求更快的数组能够从数据库返回数据。因此，所有$ scope.counts都会成为上次迭代时调用的内容。我可能会离开。 问题：有没有办法将数据库中的传入数据绑定到ng-repeat指令的每次迭代？或者，让每次迭代等待数据从数据库/请求加载，然后再转到下一个？我好几天都在寻找解决方案，但我发现的任何东西似乎都没有解决这个看似简单的问题。

server.js

MongoClient.connect(process.env.MONGOLAB_URI, function(err, db) {
    var plantList = db.collection("plantList");

app.get('/getrooms', function(req, res) {
       plantList
           .distinct("room", function(err, docs) {
           res.json(docs);
       });
    });

app.get('/getplantsbyroom/:room', function(req, res) {
        var roomReq = req.params.room;
        plantList.count({"room":roomReq}, function(err, count) {
            res.json(count);
        });
    });

});

controller.js

$http.get('/getrooms').success(function (response) {
            $scope.rooms = response;
        });

$scope.plantCount = function(room) {
        var url = '/getplantsbyroom/' + room;
        $http.get(url).success(function (response) {
            $scope.count = response;
    };

的index.html

<div ng-repeat="room in rooms"  ng-init="plantCount(room)">
            <p>{{room}}</p>
            <p>{{count}} Plants</p>

Answer 1

如何为每个div添加带有索引的Id

<div ng-repeat="room in rooms" id="{{'room'+$index}}"  ng-init="plantCount(room,$index)">

然后在将$ index传递给函数之后，你应该能够指定哪个div调用这个ajax，count应该是数组中room房间对象的一部分，$ index应该是对象的$ index在那个阵列中......

Answer 2

您只有一个$ scope.count变量，您始终将其设置为相同的响应值（最后重复的项目）。你应该把它绑在房间对象上，

$http.get('/getrooms').success(function (response) {
        $scope.rooms = response.map(function(i){return i.name:i});
    });

$scope.plantCount = function(room) {
        var url = '/getplantsbyroom/' + room;
        $http.get(url).success(function (response) {
            room.count = response;
    };

<div ng-repeat="room in rooms"  ng-init="plantCount(room)">
        <p>{{room.name}}</p>
        <p>{{room.count}} Plants</p>

或者你可以通过为房间创建一个指令来创建一个孤立的范围（它将拥有它自己的$ scope.count）

使用ng-repeat同步数据库中请求的数据

2 个答案: