minijsgreeting

######datei index.html
<html>
   <head>
      <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
      <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular-resource.js"></script>
      <script src="app.js"></script>
   </head>
   <body ng-app="greetingApp">
    <greeting></greeting>
   </body>
</html>


######datei app.js
angular.
 module('greetingApp', [
  'ngResource'
 ]);
//siehe factory pattern
//erzeugt aus rest-resource dinge
angular.
  module('greetingApp').
  factory('Greeting', ['$resource',
    function($resource) {
      return $resource('http://rest-service.guides.spring.io/greeting', {}, {
        query: {
          method: 'GET',
          isArray: false
        }
      });
    }
  ]);

//magic happens here
angular.
  module('greetingApp').
  component('greeting', { //das ist für den neuen html-tag
    template:
    '<p> ID: {{ $ctrl.greeting.id }} </p>' +
        '<p> Content: {{ $ctrl.greeting.content }} </p>',
  controller: ['Greeting',
      function GreetingController(Greeting) { //das C aus MVC auf der client seite
        this.greeting = Greeting.query();
      }
    ]
  });