Как загрузить данные json в контроллере, используя службы в угловом?

Question

Я пытаюсь отобразить данные json, которые я получаю от своего контроллера rails в своих представлениях. Но я считаю, что что-то не хватает во время вызова службы в контроллере приложений.

**My service** 
.service("articles", function($http){ 

     var o = this; 
     o.getall = function(){ 
     return $http.get('/articles.json').then(function(response){ 
      console.log(response.data); 
      return response.data; 
      }); 
     }; 
     }); 

    **My controller** 
    .controller('FirstCtrl', function($scope, articles, Data){ 

     var first = this; 
     first.message = "Welcome!" 
     first.data = articles.getall(); 
     }); 

    **Angular route** 
    $stateProvider.state("first", { 
     url : "", 
     controller : "FirstCtrl as first", 
     templateUrl: "templates/first.html" 
     }); 

    First.html 
    <h1> Angular-rails </h1> 
    <h2>{{first.message}}</h2> 
    <div ng-repeat="article in first.data"> 
    <h2>{{article.title}}</h2> 
    <h2>{{article.description}}</h2> 
     </div> 

Answer 1

возвращение обещание от сервиса к контроллеру, как этот

*My service** 
.service("articles", function($http){ 
    var o = this; 
    o.getall = function(){ 
    return $http.get('/articles.json'); 
    }; 
    }); 

**My controller** 
.controller('FirstCtrl', function($scope, articles, Data){ 
    var first = this; 
    first.message = "Welcome!" 
     articles.getall().then(function(response){ 
     console.log(response.data); 
     first.data = response.data; 
     });; 
    }); 

**Angular route** 
$stateProvider.state("first", { 
    url : "", 
    controller : "FirstCtrl as first", 
    templateUrl: "templates/first.html" 
    }); 

First.html 
<h1> Angular-rails </h1> 
<h2>{{first.message}}</h2> 
<div ng-repeat="article in first.data"> 
<h2>{{article.title}}</h2> 
<h2>{{article.description}}</h2> 
    </div>