Question

我有以下代码来动态填充$ scope中的数组：

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

mapApp.controller('MapController', function($scope) {

  $scope.establishments = [];

  function removeMarkers() {
    for (var x = markers.length - 1; x == 0; x--)
      markers[x].setMap(null);

    markers.length = 0;
    $scope.establishments.length = 0;
  }

  function onMapCenterChanged() {



    $.getJSON('https://api.....', function(data) {
      if (data) {
        $('#json').text(JSON.stringify(data));
        if (data.response) {
          removeMarkers();

          $.each(data.response.groups[0].items, function(index, row) {

            var venue = {
              name: row.venue.name,
              address: row.venue.location.address,
              rating: row.venue.rating,
              price: row.venue.price.tier
            };

            $scope.establishments.push(venue);
          });

          // DO I REALLY NEED TO CALL THIS?
          $scope.$apply()
        }
      }
    });
  }
}

});

我正在使用此代码显示场所数组：

<li ng-repeat="venue in establishments">
    <span>{{ venue.name }}</span>
    <p>{{ venue.address }}</p>
    <p>Price: {{ venue.price }} - Rating: {{ venue.rating }}</p>
</li>

但是，我只得到这样一个列表：

价格： - 评级：
价格： - 评级：
价格： - 评级：

为什么不工作？为什么在向我的作用域中的数组添加项目时需要调用apply方法？

更新

如果我在$scope.establishments之后检查$scope.$apply();的值，则所有值都在那里。但是，如果我在我的HTML中放置{{ establishments }}，它就不显示任何内容。

更新2

我做了一个测试，将整个代码复制到jsfiddle并且它可以工作（一切都打印出来）。在localhost上运行的版本运行时没有任何错误（在Chrome开发者工具上），但不打印数组中的项目。

以下是包含完整代码的jsfidlle。

Answer 1

我发现了真正的问题和解决方案。

我正在使用Python / Django项目，该项目也使用花括号（{{}}）作为模板，因此它们存在冲突。

解决方案是用ng-bind替换大括号。

值不会显示在ng-repeat模板上，但仅显示在localhost上

更新

更新2

1 个答案: