无法从Json文件加载数据

Question

我正在尝试做的是创建图像网格布局。 与此类似，但每个框中都有一张通过HTTP.get从json文件加载的照片

我正在尝试通过创建第一行然后使用ng-repeat来创建网格布局，以便创建新行。

我正在从$http.get请求检索图像，该请求通过JSON文件加载图像。

我无法显示图像，我不确定为什么。 我的控制台日志中没有错误。

到目前为止，这是我的HTML代码。

<div class="row" ng-repeat="" ng-if="$index % 1 === 0">
  <div class="col col-33" ng-if="$index < length">
    <img ng-src="{{image.image}}">
  </div>
</div>

Answer 1

您看不到任何图像的原因是因为您无法正确访问HTML中的数据。 尝试这个：

<div class="row" ng-repeat="image in data.under9s">
<div id="container" class="col col-33" ng-if="$index < data.under9s.length">
    <img class="image image-list-thumb" id="image" ng-src="{{image.image}}" />
</div>
<div id="container" class="col col-33" ng-if="$index + 1 < data.under9s.length">
    <img class="image image-list-thumb" id="image" ng-src="{{data.under9s[$index + 1].image}}" />
</div>
<div id="container" class="col col-33" ng-if="$index + 2 < data.under9s.length">
    <img class="image image-list-thumb" id="image" ng-src="{{data.under9s[$index + 2].image}}" />
</div>

我认为您可以使用两个ng-repeats轻松完成网格。 就像是：

<div class="row" ng-repeat="category in data">
    <div ng-repeat="image in category" id="container" class="col col-33">
        <img class="image image-list-thumb" id="image" ng-src="{{image.image}}" />
    </div>
</div>

Answer 2

那是安全问题。 使用jsonp或CORS 。