Question

我在角度控制器中有以下代码：

  $scope.openCat = function(catId) {
    $http.get('/api/cat/' + catId).
      success(function(data) {
        $scope.sortedArticles = [];
        var lst = data.articles;
        lst.forEach(function(n) {
          $http.get('/api/article/' + n).
            success(function(article) {
              $scope.sortedArticles.push(article);  
          });  
        });
      });
  };

由于mongo中的类别集合与文章集合交叉引用，因此http.get仅返回article._ids。我的想法是按类别显示文章链接，然后我有另一个控制器处理单个文章点击并呈现内容：

  $scope.articleClick = function(n) {        
    $http.get('/api/article/' + n).
      success(function(data) {
        $scope.form = data;
      });    
  };

代码全部按照我的意愿运行，但我的问题是：我是否复制了http请求？或做其他可怕的错误？请注意我是全新的，只是尝试，所以我可能完全走错了轨道。我应该为此使用服务吗？感谢。

Answer 1

这不是一个好习惯，因为如果您有50篇文章，那么您的代码将只为他们提出52个请求。始终尝试最小化http请求，因为它们是您的瓶颈。后端的简单代码如下所示：

app.get('/api/cat/:cat', function(req, res) {
    var catid = req.params.cat;

    ArticleModel.find({cat: catid}, function(err, data) {
        if ( err || !data ) {..}

        var output = [];

        data.forEach(function(i){
            output.push({
                title: i.title,
                id: i._id
            });
        });

        res.json(output);
    });
});

所以你只发送一篇文章标题和id的JSON数组。然后使用简单的ng-repeat，你可以做到：

<div ng-repeat="article in articles">
     <a ng-href="article.id">{{article.title}}</a>
</div>

同时处理角度：

$scope.openCat = function(catId) {
    $http.get('/api/cat/' + catId).success(function(data) {
        $scope.sortedArticles = data;
    });
};

因此，只有1个查询，您才能获得所需的所有信息。

尝试将API与服务/工厂分开。您可以阅读更多here。

我在角度控制器中制作了太多的http请求吗？

1 个答案: