无法从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重复轻松完成网格。类似的东西：

<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。