Javascript AngularJS$scope.push不从$http数据响应更新视图

我正在对500pxapi执行一个

$http

请求，以获取一组流行照片。已成功返回响应对象，将返回的照片项推送到视图时遇到问题

我的控制器代码如下所示：

meanApp.controller 'SearchController', ['$scope', '$http', 'Global', ($scope, $http, Global) ->

  $scope.global = Global
  $scope.photos = []

  $scope.submit = ->
    if $scope.text

      $http.get("https://api.500px.com/v1/photos?feature=popular").success (data) ->
        $scope.photos.push data

]

<h1>Photo search</h1>

<form ng-submit="submit()" ng-controller="SearchController">
Enter text and hit enter:
  <input type="text" ng-model="text" name="text">
  <input type="submit" id="submit" value="Submit">
</form>

<ul>
  <li ng-repeat="photo in photos.photos">{{photo.name}}</li>
  <li ng-hide="photos.length">No photos</li>
</ul>

响应对象（作为JSON）如下所示（为简洁起见进行了精简）：

我的观点是这样的：

meanApp.controller 'SearchController', ['$scope', '$http', 'Global', ($scope, $http, Global) ->

  $scope.global = Global
  $scope.photos = []

  $scope.submit = ->
    if $scope.text

      $http.get("https://api.500px.com/v1/photos?feature=popular").success (data) ->
        $scope.photos.push data

]

<h1>Photo search</h1>

<form ng-submit="submit()" ng-controller="SearchController">
Enter text and hit enter:
  <input type="text" ng-model="text" name="text">
  <input type="submit" id="submit" value="Submit">
</form>

<ul>
  <li ng-repeat="photo in photos.photos">{{photo.name}}</li>
  <li ng-hide="photos.length">No photos</li>
</ul>

照片搜索
输入文本并按Enter键：

{{photo.name}
无照片

当前的行为是，

不更新。预期的行为是将

照片

项推送到

s。我读过关于可能需要使用

$apply

，但这也没有给我带来任何运气。

更新 问题是您的

ng repeat

超出了

SearchController

<form ng-submit="submit()" ng-controller="SearchController">
Enter text and hit enter:
  <input type="text" ng-model="text" name="text">
  <input type="submit" id="submit" value="Submit">
</form> <!-- end SearchController -->

<ul>
  <!-- Outside of SearchController's scope -->
  <li ng-repeat="photo in photos.photos">{{photo.name}}</li> 
  <li ng-hide="photos.length">No photos</li>
</ul>

如果是这种情况，则需要使用如下表达式访问它：

<li ng-repeat="photo in photos[0].photos">

---

在这种情况下，您的表达式可能会按照当前的方式工作。

首先确保您的响应可用作Javascript对象。 设法

在$http.get的success函数中，查看数据是JavaScript对象还是对象数组（在浏览器的JS控制台中）。如果它显示为字符串，则需要使用JSON解析响应

JSON.parse(response);

在推到阵列之前。请注意，要推送到$scope.photos数组的对象必须是照片对象。console.log（$scope.photos）应该显示对象的数组。最后，在推送数据之后，您需要运行

$scope.apply();

---

请尝试

$scope.photos.push data.data

不幸的是，这样做似乎不行，

console.log（data.data）

给了我

未定义的

。我没有机会尝试你的建议（也是两者的结合）。这可能与以下事实有关：

photos:[…]

中的每张照片都有一个索引吗？我以为photos:[]是一个数组。听起来像是一个带数字键的对象？你能用完整的JSON输出替换问题中的简短回答吗？看起来我有点困惑了。我已经运行了

console.log（angular.toJson（data））

并更新了上面的响应。

JSON.parse(response);

$scope.apply();