Angular ng-repeat未加載

Question

我過去曾做過這項工作，已經在localhost上移動了該站點，現在卻似乎無法讓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資源-加載正常

因此，僅需確認一下：數據正在使用$scope.fetch從/ order / series_list $scope.fetch ，firebug指示頁面已被獲取並包含頁面內容。 然后，這應該將數據傳遞到$scope.loadedItems ，然后將其輸出到$scope.products 。

在html中，有一個ng-repeat ，然后應遍歷產品中的所有產品。 目前，我的.Initialloader沒有被隱藏，而ng-repeat仍然被隱藏。

非常感謝您的幫助-我已經處理了幾個小時，似乎無法弄清楚是什么原因引起的。

提前致謝。

Answer 1

如果在加載完成前嘗試打印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操作/更新。 您有為此的指令。

Answer 2

如果您從循環中刪除過濾器，是否有效？

在相關說明上， $('.Initialloader').show(); 可以替換為ngShow

Answer 3

AHHHH。 弄清楚了。 我的json有問題！ 很煩人。 非常感謝所有花時間回答的人-非常感謝。