ElasticSearch + AngularJS 结果未显示答案

【问题标题】：ElasticSearch + AngularJS Results not displayedElasticSearch + AngularJS 结果未显示
【发布时间】：2016-03-03 11:05:47
【问题描述】：

我在使用 AngularJS 显示弹性搜索客户端返回的数据时遇到问题。我的 html 正文中有以下代码：

<div ng-app="elasticApp" ng-controller="elasticCtrl" class="container-fluid">
  <div ng-repeat="x in hits">
    {{ hits._id }}
  </div>
</div>

以及以下 AngularJS 部分：

var elasticApp = angular.module('elasticApp', ['elasticsearch']);

elasticApp.controller('elasticCtrl', function ($scope, esFactory) {
  var client = new elasticsearch.Client({
    host: 'localhost:9200',
    log: 'trace'
  });

  client.search({       
    index: 'riverindex',
    type: 'river',
    body: {
      query: {
        "match_all" : { } 
      }
    }
  }).then(function (resp) {
    $scope.hits = resp.hits.hits;
    console.log($scope.hits);
  }, function (err) {
    console.trace(err.message);
  });
});

我正在尝试显示 elasticsearch 客户端返回的结果。在控制台中，我可以看到正确返回了 JSON 数据：

TRACE: 2015-11-29T19:00:09Z

-> POST http://localhost:9200/riverindex/river/_search
{
  "query": {
    "match_all": {}
  }
}

<- 200
{
  "took": 4,
  "timed_out": false,
  "_shards": {
    "total": 5,
    "successful": 5,
    "failed": 0
  },
  "hits": {
    "total": 1,
    "max_score": 1,
   "hits": [
      {
        "_index": "riverindex",
        "_type": "river",
        "_id": "563e18e6d5603e015ca34165",
        "_score": 1,
        "_source": {
          "test": "test",
          "_id": "563e18e6d5603e015ca34165"
        }
      }
    ]
  }
}

很遗憾，我在网页上看不到结果。

以下是console.log($scope.hits)的结果：

我是 AngularJS 的新手，所以如果你知道它为什么不起作用，请尽量简单地解释一下。

【问题讨论】：

上述日志是否来自console.log($scope.hits);还是只显示请求/响应？
以上日志来自console.log($scope.hits);
为什么使用 console.log($scope.hits);显示完整的响应，它应该只显示“命中”内的任何内容，试试 console.log($scope.hits.hits)
对不起，我的错。我更新了我在这个主题中的主要帖子。我在打印屏幕上附加了来自 console.log($scope.hits); 的日志。第一篇文章中的 JSON 是来自 elasticsearch 的响应。 console.log($scope.hits.hits) 显示错误。

标签： javascript html angularjs json elasticsearch

【解决方案1】：

我觉得你的观点应该是

<div ng-app="elasticApp" ng-controller="elasticCtrl" class="container-fluid">
  <div ng-repeat="x in hits">
    {{ x._id }} <---- here
  </div>
</div>

【讨论】：

你是对的，但它仍然不起作用：/不知道为什么

【解决方案2】：

好的，我找到了简单的解决方案，但这可能不是一个真正优雅的解决方案。

在角度部分：

client.search({     
      index: 'riverindex',
      type: 'river',
      body: {
        query: {
                "match_all" : { } 
           }
      }
    }).then(function (resp) {
        $scope.hits = resp.hits.hits;

        $scope.$apply(function () {     
        });
    }, function (err) {
        console.trace(err.message);
    });

【讨论】：