AngularJS Hello World

In this example, we do a very simple AngularJS example.

by PRAGADEESH S

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.14/angular.min.js"></script>
<div ng-controller='MyController'>
    <!-- name model value is inserted below -->
    <h1>Hello, {{ data }}!</h1>
    <!-- name model value can be set by this <input> -->
    <input type="text" ng-model="name">
</div>

JavaScript

// <body ng-app='myApp' binds to the app being created below.
var app = angular.module('myApp', []);

// Register MyController object to this app
app.controller('MyController', function MyController($scope, customHTTPService) {
    $scope.name = 'World';
    $scope.data = customHTTPService.getRequest().data;
});    

// We define a simple controller constructor.


app.factory('customHTTPService', function($http){
  return {
    getRequest: function() {
      return $http.get('../JSON/permanentEmployees.json').
      success(function(data, status, headers, config) {
        return {data: data, errorMessage: "Success"};
      }).
      error(function(data, status, headers, config) {
        return {data: "", errorMessage: "Requested grid data file does not exist"};
      });
    } 
  }
});