1

过去我有这个工作，我已经在本地主机上移动了网站，现在我似乎无法ng-repeat显示结果。有任何想法吗？

应用程序：

var app = angular.module('Search', ['ngResource']);

function seriesListCtrl ($scope, $http) {

// Set the defaults
$scope.url = '/order/series_list';
$scope.products = [];

// On Success add data to the products array
$scope.loadedItems = function (data, status) {
    $scope.products = data;
    $('.Initialloader').hide();
}

// Fetch the URL where the JSON array is
$scope.fetch = function () {
    $('.Initialloader').show();
    $http.get($scope.url).success($scope.loadedItems);
}

// Instantiate the process
$scope.fetch();

}

/order/series_list 加载正常。但是，数据似乎没有加载到范围内并重复。

HTML：

<div class="order_wrapper" ng-app="Search">
<div ng-controller="seriesListCtrl">

    <div class="well">
        <form class="form-inline">
            <div class="col-lg-5"><input type="text" class="form-control" placeholder="Search Description" ng-model="query.series_description"></div>
            <div class="col-lg-5"><input type="text" class="form-control" placeholder="Search Part Number/SKU" ng-model="query.product_sku"></div>
            <button type="submit" class="btn btn-default"><i class="icon-search"></i> Search</button>
        </form>
    </div>

    <div class="accordion" id="product_list">
        <div class="accordion-group" ng-repeat="prod in products | filter:query">
            <div class="accordion-heading order_listing">
                <div class="row">
                    <div class="col-lg-2 image_container">
                        <img ng-src="{{prod.images_url}}" width="100px">
                    </div>
                    ......... Extra blurb ........
                </div>
            </div>
        </div>
    </div>
</div>

AnjularJS 1.2.0 - 加载正常

angularjs-resource - 加载正常

所以只是为了确认：数据正在从 /order/series_list 加载$scope.fetch，firebug 表明该页面已被获取并且其中包含内容。然后，这应该将数据传递$scope.loadedItems给$scope.products.

在 html 中，有一个ng-repeat应该循环遍历产品中的所有产品。目前，我.Initialloader没有被隐藏，ng-repeat只是保持隐藏。

非常感谢您对此提供的帮助-我已经研究了几个小时，但似乎无法弄清楚导致问题的原因。

提前致谢。

4

3 回答 3

0

啊。弄清楚了。我的 json 有问题！很烦人。非常感谢所有花时间回答的人 - 非常感谢。

于 2013-10-30T14:59:06.840 回答
0

products如果您在加载完成之前尝试打印，该列表可能为空。

我会使用 promise factory 来处理异步调用。

所以你可以像这样写工厂：

app.factory('Data', ['$http','$q',  function($http, $q) {

  var data  = $http.get("your URL");    

       var factory = {
            query: function (selectedSubject) {
                var deferred = $q.defer();
                 deferred.resolve(data);
                  return deferred.promise;
            }
        }
        return factory;
}]);

并从控制器调用：

function seriesListCtrl ($scope, Data) {

...

      Data.query()
                    .then(function (result) {
                       $scope.products = data;
                    }, function (result) {
                        alert("Error: No data returned");
                    });

作为旁注

我强烈建议不要在控制器中进行任何 DOM 操作/更新。你有这方面的指示。

于 2013-10-30T13:23:13.147 回答
0

如果您从循环中删除过滤器，它会起作用吗？

在相关说明中，$('.Initialloader').show();可以用ngShow替换

于 2013-10-30T13:39:27.500 回答