<!DOCTYPE html>

<html ng-app="web">

<head>

  <script data-require="angular.js@1.6.2" data-semver="1.6.2" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.2/angular.js"></script>

  <link rel="stylesheet" href="style.css" />

  <script src="app.js"></script>
  <script src="controller.js"></script>
  <script src="service.js"></script>  
</head>

<body ng-controller="ctrl">

  <h1>{{Data}}</h1>

</body>

</html>
var app = angular.module('web', []);
/* Styles go here */

app.controller("ctrl", ["$scope", "myService", function($scope, myService) {
  $scope.Data = myService.get();
}]);
app.factory("myService", function() {
  var service = {
    Data:  "Datasafasfsad",
    
    get: function() {
      return service.Data;
    }
  }
  
  return service;
});