我过去曾经使用过这个工作,我已经在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-resource - 正常加载
所以只是为了确认:数据是使用$scope.fetch
从/ order / series_list加载的,firebug表示该页面已被提取并且其中包含内容。然后,这应该将数据传递给$scope.loadedItems
,然后将其输入$scope.products
。
在html中,有一个ng-repeat
应该循环遍历产品中的所有产品。目前,我的.Initialloader
未被隐藏,ng-repeat
仍然隐藏。
我真的很感谢你对此的帮助 - 我已经使用了几个小时,似乎无法弄清楚是什么导致了这个问题。
提前致谢。
答案 0 :(得分: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操作/更新。你有指令。
答案 1 :(得分:0)
如果从循环中删除过滤器,它是否有效?
在相关说明中,$('.Initialloader').show();
可以替换为ngShow
答案 2 :(得分:0)
AHHHH。弄清楚了。我的json有问题!很烦人。非常感谢所有花时间回答的人 - 非常感谢。