javascript - AngularJS $watch not updating my output -

i have html looks -

<div ng-controller="postsctrl">     <ul ng-repeat="post in posts" style="list-style: none;">         <li style="padding: 5px; background-color: #f5f5f5;">             <h4>                 <a href="#" ng-click="showdetails = ! showdetails">{{post.posttitle}}</a>             </h4>             <div class="post-details" ng-show="showdetails">                 <p>{{post.postcontent}}</p>             </div>         </li>     </ul> </div> 

now data being populated json based rest url , being displayed. have form adding new post database-

<form data-ng-submit="submit()"         data-ng-controller="formsubmitcontroller">         <h3>add post</h3>         <p>             title: <input type="text" data-ng-model="posttitle">         </p>         <p>             content: <input type="text" data-ng-model="postcontent">         </p>         <p>             tags: <input name="posttags" data-ng-model="posttags" ng-list                 required>         </p>         <input type="submit" id="submit" value="submit" ng-click="loadposts()" /><br>     </form> 

i want achieve 2 things - 1. add new post shows in list of posts above. 2. manually add new post in backend, front end automatically updates.

is possible achieve both using angular , if yes how able that. below controller code, of showing me existing posts letting me add new post db.

<script>     var app = angular.module("myapp", []);      app.controller("postsctrl", function($scope, $http) {         $http.get('http://localhost:8080/myapp/posts')             .success(function(data, status, headers, config) {                 $scope.posts = data;             }).error(function(data, status, headers, config) {                 console.log("error in fetching json data.");             });             $scope.$watch('posts', function(newval, oldval){                 console.log('changed');                 alert('hey, myvar has changed!');             }, true);         /*$scope.$watch('posts', function() {             alert('hey, myvar has changed!');             console.log("test log");             $scope.$digest();         });*/     });      app.controller('formsubmitcontroller', [ '$scope', '$http',         function($scope, $http) {              $scope.loadposts = function() {                 $http.get('http://localhost:8080/myapp/posts')                 .success(function(data, status, headers, config) {                     $scope.posts = data;                     alert(json.stringify(data));                     //$scope.posts_updated = data;                 }).                 error(function(data, status, headers, config) {                     console.log("error in fetching json data.");                 });             }              $scope.list = [];              $scope.submit = function() {                  var formdata = {                     "posttitle" : $scope.posttitle,                     "postcontent" : $scope.postcontent,                     "posttags" : $scope.posttags,                     "postedby" : "admin"                 };                  var response = $http.post('addpost', formdata);                 response.success(function(data, status, headers, config) {                     console.log("na");                 });                 response.error(function(data, status, headers, config) {                     alert("exception details: " + json.stringify({                         data : data                     }));                 });                  //empty list data after process                 $scope.list = [];              };         } ]); </script> 

any on appreciable.

1: on success of post, can push added object posts list. trigger two-way-binding, , object "automatically" appear in ng-repeater.

$scope.posts.push(element); 

2: 1 bit tricky, since angular client-side application, doesn't recognize happens on server-side. have make work @ websockets (like signalr or similar) can make push client whenever gets added. depends on "manual" insert done using programatically method. doing directly database-changes going alot more painfull