[英]angular js ng-repeat is not working with owl carousel
I am working on the news update section of my Angular website, where I want to display the latest news updates with owl carousel but ng-repeat displays nothing . 我正在Angular网站的新闻更新部分中工作,在这里我想显示有关owl carousel的最新新闻更新,但是ng-repeat什么也不显示。 json data is displaying in console but not in front.
json数据显示在控制台中,但不在前面。
My code is as follows: 我的代码如下:
<div id="owl-news" ng-controller="newsController" data-ng-init="news()">
<div class="item" ng-repeat="news in allData">
<div class="news-1">
<div class="body">
<p>{{ news.news}}</p>
<div class="title">{{news.news_date}}</div>
</div>
</div>
</div>
</div>
Angular code : 角度代码:
app.controller("newsController",function($http,$scope,$log){
var news=function(){
$http({
method:"POST",
url:"getNews.php",
dataType:"json"
}).then(function(data){
$log.log(data);
$scope.allData=data;
},function(data){
$log.log("Error has occured!.");
});
}; news();
});
I tested it in JSFiddle: https://jsfiddle.net/smoki99/rqwz6mno/12/ 我在JSFiddle中对其进行了测试: https ://jsfiddle.net/smoki99/rqwz6mno/12/
After doing a lot of tests: 经过大量测试:
$scope.allData the correct return value. $ scope.allData正确的返回值。 Usually "data" contains an additional data field.
通常,“数据”包含一个附加的数据字段。 I unfortunably not know, what your exact "JSON" return looks like, but it take it from this as source ( http://www.dysartpharmacy.com/index.php/site_search/get/news )
不幸的是,我不知道您的确切“ JSON”返回是什么样子,但是它以此为源( http://www.dysartpharmacy.com/index.php/site_search/get/news )
So I think you must change your line simply to 所以我认为您必须将行更改为
$scope.allData = data.data;
Here my complete example: 这是我完整的示例:
<div ng-app="myApp" ng-controller="newsController">
<div class="item" ng-repeat="news in allData">
<div class="news-1">
<div class="body">
<p>{{ news.news}}</p>
<div class="title">{{news.news_date}}</div>
</div>
</div>
</div>
</div>
And JS Code: 和JS代码:
// the main (app) module
var app = angular.module("myApp", []);
// add a controller
app.controller("newsController",function($http,$scope,$log, $httpParamSerializerJQLike){
var returnData = '[{"news":"news1","news_date":"2017-09-14"}, {"news":"news2","news_date":"2017-09-14"}]';
var data = $httpParamSerializerJQLike({
json: returnData
});
var news = function() {
$http({
method: "POST",
url: "/echo/json/",
datatype: "json",
data: data
}, data).then(function (data) {
debugger;
$log.log(data);
$scope.allData = data.data;
},function(data) {
$log.log("Error has occured!");
});
};
news();
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.