JSFiddle - React, Tailwind, and code Playground

HTML

<div class="" 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>
<script>

    $(document).ready(function () {
        $(".owl-carousel").owlCarousel({
            loop: true,
            items: 1
        });
    });
</script>

JavaScript

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