角度js ng-repeat不适用于猫头鹰旋转木马

时间:2017-09-20 07:37:04

标签: javascript angularjs

我正在处理我的Angular网站的新闻更新部分,我想用owl carousel显示最新的新闻更新,但ng-repeat没有显示任何内容。 json数据显示在控制台中但不在前面。

我的代码如下:

<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>

角度代码:

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();

        });   

1 个答案:

答案 0 :(得分:0)

我在JSFiddle中测试过它:https://developer.android.com/training/sharing/receive.html

经过大量测试后:

$ scope.allData正确的返回值。通常&#34;数据&#34;包含一个额外的数据字段。我不幸地不知道,你的具体是什么&#34; JSON&#34;返回看起来像,但它从它作为源(https://jsfiddle.net/smoki99/rqwz6mno/12/

所以我认为你必须简单地改变你的行

$scope.allData = data.data;

这是我的完整示例:

<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>

和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();

});