JSFiddle - React, Tailwind, and code Playground

HTML

<div  ng-app="eli" ng-controller="mainCtrl">
  
  <div id="mypost" class="col-md-8 panel-default" ng-repeat="post in myposts">
    <div id="eli-style-heading" class="panel-heading">
      <% post.title %>
    </div>
    <div class="panel-body panel">
      <figure>
        <p>
          <% post.body %>
        </p>

      </figure>
    </div>
  </div>
</div>

JavaScript

var app = angular.module('eli', []);

app.config(function($interpolateProvider) {
    $interpolateProvider.startSymbol('<%');
    $interpolateProvider.endSymbol('%>');
});

app.controller('mainCtrl', function($scope, $http, $timeout){
	$scope.posts = {};
$scope.myposts = [{title:"titillating title",body:"Hot boddy"}]
	$scope.addPost = function(){
  
		$http.post('/auth/post', {
			title: $scope.post.title,
			body: $scope.post.body

		}).then(function(data, status, headers, config){
			$scope.posts.push(data);	
		
		});

	};

	$scope.getPosts = function(){

		$timeout(function(){
      debugger;
      $scope.myposts = [{title:"something new",body:"It's my body"}]
    },3000)
		//$http.get('/auth/posts').then(function(data){
		//	$scope.myposts = data.data;
		//	$scope.$apply();
		//});
	};
  $scope.getPosts();



});