<!DOCTYPE html>
<html ng-app="Weight">
<head>
  <title>Weight</title>
  <style>
    a[ ng-click ] {
      color: #ff00cc;
      cursor: pointer;
      text-decoration: underline;
      }
  </style>
  <script type="text/javascript" src="lib/jquery.js"></script>
  <script type="text/javascript" src="lib/angular.js"></script>
</head>

<body ng-controller="WeightController">
<ul>
  <li ng-repeat="entry in weightData">
    {{ entry }}
  </li>
</ul>

<script type="text/javascript">
   var app = angular.module( "Weight", []);
   app.controller(
       "WeightController",
       function( $scope, weightService) {

         $scope.weightData = [];

         loadRemoteData();



         function applyRemoteData(newData)
         {
           $scope.weightData = newData;
         }


         function loadRemoteData() {
           weightService.getWeight()
               .then(
                   function(weightData) {
                     applyRemoteData(weightData);
                   }
               )
         }
       }
   );


  app.service(
    "weightService",
      function($http, $q) {
        return({getWeight:getWeight});

        function getWeight() {
           var request = $http({
             method: "get",
             url:"/weight/all",
             params: {
              /* action:"get"*/
             }
           });
          return (request.then(handleSuccess, handleError));
        }



        function handleError(response) {
          if ( !angular.isObject(response.data) || !response.data.message) {
            return( $q.reject("An unknown error occured"));
          }

          return($q.reject(response.data.message));
        }

        function handleSuccess(response)
        {
          return(response.data);
        }

      }
  );
</script>

</body>




</html>