angularjs - 在前端过滤MongoDB数据

Question

我在使用 MongoDb 时遇到了一些小问题。我有 2 个集合:拍卖和用户。在“用户”中，我显然存储了用户(邮件、姓名等)。在拍卖中，我存储了产品(创建日期、创建者、关注者、邀请、图像)。现在，我想在每个用户的仪表板中仅显示他关注的产品(当他单击关注按钮时，他的名字存储在“FOllowedBy”中)。如果我必须在后端进行过滤，那么一切就很清楚了，相反，我想从数据库加载所有数据，然后使用 angularJs 在前端过滤该数据。

使用像createdBy这样的简单字段很容易:如果我有一个名为“Alex”的用户(例如)，只有当createdBy与Alex(或每个其他用户)匹配时，我才能显示数据。但同样的事情不适用于像“FollowedBy”这样的数组字段。如果在产品“表”中创建者:“Mark”，其次是:“Alex”和“Jack”，我可以轻松过滤所有产品以仅显示 Mark 的产品，但我不明白如何仅显示其后的产品亚历克斯，因为这个字段是一个数组。

这是我的后端路线。

           app.get('/api/dashboard', function (req, res) {

    AllAuctions
        .find({}, function (err, auctions) {
            if (err)
                res.send(err);
            console.log(auctions);
            res.send(auctions);

        });
});

我使用 $http 和 angularJs 加载它:

         $http.get('/api/dashboard').then(function (AllAuctions) {
           $scope.allauctions = AllAuctions.data;

       });

如果我必须过滤“createdBy”字段，我可以这样做:

           <div class="panel panel-default" >
    <div class="panel-heading">My Auctions</div>
    <div class="panel-body">
        <ul class="list-group" ng-repeat="allauction in allauctions">
            <li class="list-group-item" ng-show="allauction.createdBy=='Alex'">
                    <img ng-src="{{allauction.imgUrl}}">
                    <div class="title"> {{allauction.title}} </div>

</li>
</ul>
</div>
</div>

但我不明白如何过滤这样的字段:

                 FollowedBy: [
                      Shelly.name,
                      Dario.name
                 ]

仅显示 Dario 关注的产品。

Answer 1

如果你想用 html 来做，你可以这样做

ng-show="allauction.FollowedBy.indexOf('Alex')>=0"

但是，当你有多个过滤器时，它很快就会变得硬核。您应该在 javascript 中定义一个过滤函数，该函数将计算一个过滤后的数组，您可以在该数组上执行简单的 ng-repeat。或者，您也可以向您的拍卖对象添加一个标志，并根据该标志执行 ng-if/ng-show。例如:

function updateFilteredData()
{
    $scope.filteredData = [];
    for(var i = 0; i< $scope.allauction; i++)
    {
         var auction = $scope.allauction[i];
         if(auction.createdBy !== currentUser.name) //I assume currentUser is json object for your Alex user
             continue;
         if($scope.followByFilter && auction.FollowedBy.indexOf($scope.followByFilter) < 0)
              continue; //I assume followByFilter is a string containing the name of a follower you are trying to filter

         $scope.filteredData.push(auction);
    }

}

您需要在 $http get 中调用此函数一次，并且每次过滤条件发生变化(例如:followByFilter 名称更改...)。当然，您应该对filteredData数组进行ng-repeat而不是alauction。