Javascript Angularjs问题$http.get不起作用

Javascript Angularjs问题$http.get不起作用,javascript,angularjs,http,get,ionic,Javascript,Angularjs,Http,Get,Ionic,我正在使用构建在AngularJS上的框架ionic创建一个移动应用程序 我试图从JSON文件将图像加载到我的应用程序中,但无法正确加载 有人能帮我吗 这是我的HTML: <ion-view view-title="Gallery" align-title="center" ng-controller="photoCtrl" ng-init="getImages()"> <ion-content> <div class="col col-25

我正在使用构建在AngularJS上的框架ionic创建一个移动应用程序

我试图从JSON文件将图像加载到我的应用程序中,但无法正确加载

有人能帮我吗

这是我的HTML:

<ion-view view-title="Gallery" align-title="center" ng-controller="photoCtrl" ng-init="getImages()">
    <ion-content>
        <div class="col col-25" ng-repeat="image in images">
            <img ng-src="{{images}}" width="100%" />
        </div>
    </ion-content>
</ion-view>
请换

而不是


ng src=“{{images}}”

这里有几个问题。首先,API调用返回一个对象,该对象具有一个名为images的属性(不是数组)。第二,您没有在HTML中访问它,因为这将是
{{{data.images}
,因为
$scope
成员被称为
data

因此,您需要做的第一件事是让API返回一个数组。如果这样做,请使用以下HTML:

<ion-view view-title="Gallery" align-title="center" ng-controller="photoCtrl" ng-init="getImages()">
    <ion-content>
        <div class="col col-25" ng-repeat="image in data.images">
            <img ng-src="{{image}}" width="100%" />
        </div>
    </ion-content>
</ion-view>

如果您只想让API返回一个图像,那么对于HTML来说,就这么简单:

<ion-view view-title="Gallery" align-title="center" ng-controller="photoCtrl" ng-init="getImages()">
    <ion-content>
        <div class="col col-25">
            <img ng-src="{{ data.images }}" width="100%" />
            <!-- data.images because that's the name returned by the API call -->
        </div>
    </ion-content>
</ion-view>


JavaScript不需要改变我上面的内容

您在
控制台中遇到的错误是什么?
ng repeat=“image in images”
ng repeat=“image in data”
我在控制台中没有遇到任何错误。我已将图像更改为数据,但仍然无法使其工作。它应该是数据中的图像吗?@smither123@Icycool-它是
ng repeat=“image in data.images”
,但前提是API返回是固定的。请参阅下面我的答案。更改为???@smither123您正在使用ng repeat循环图像,图像是值。感谢您的回复。我已经创建了一个代码笔:我仍然无法让它工作。我希望api返回许多图像,但这只是一个json示例。@smither123这是因为您的api调用仍然返回一个名为images的属性为字符串而不是数组的对象。
.controller("photoCtrl", function($scope, $http) {
    $scope.getImages = function() {
        $http.get('https://api.myjson.com/bins/30vuu')
            .success(function(data) {
                $scope.data = data;
            })
            .error(function() {
                alert("Not working");
            });
    };
});
<ion-view view-title="Gallery" align-title="center" ng-controller="photoCtrl" ng-init="getImages()">
    <ion-content>
        <div class="col col-25">
            <img ng-src="{{ data.images }}" width="100%" />
            <!-- data.images because that's the name returned by the API call -->
        </div>
    </ion-content>
</ion-view>