Угловая функция фабрики не достигнута.

Я учусь, как использовать Angularjs с ROR через этот учебник https://thinkster.io/angulartutorial/angular-rails/Угловая функция фабрики не достигнута.

Я пришел к точке, где, когда я добавляю новую функцию для службы, которая, как предполагается, чтобы получить все сообщения, которые есть в дб. Однако, когда я запускаю код, страница больше не загружается. Или, по крайней мере, html не отображается. В проверках элементов отсутствуют признаки ошибок. Однако я не уверен, что это связано с размещением функции в файле js. Я совершенно не знаком с js, и я все еще изо всех сил пытаюсь прочитать синтаксис и ошибки места в коде. Rubymine дал ключ и предупреждение о недопустимом коде для o.getAll. Если бы кто-то мог взглянуть на него и дать мне какие-то намеки, было бы здорово.

Извиняется за весь код в одном файле как html, так и js. У меня есть некоторые проблемы с конвейером активов, которые я хочу скоро зафиксировать.

app.js

BLOCKQUOTE

angular.module('flapperNews', ['ui.router']) 
//Provider 
.config([ 
    '$stateProvider', 
    '$urlRouterProvider', 
    function($stateProvider, $urlRouterProvider) { 

     $stateProvider 
      .state('home', { 
       url: '/home', 
       templateUrl: '/home.html', 
       controller: 'MainCtrl', 
       resolve: { 
        postPromise: ['posts', function(posts){ 
         return posts.getAll(); 
        }] 
       } 
      }) 
      .state('posts', { 
       url: '/posts/{id}', 
       templateUrl: '/posts.html', 
       controller: 'PostsCtrl' 
      }) 

     $urlRouterProvider.otherwise('home'); 
    }]) 
//Posts service 
.factory('posts', ['$http', function($http){ 

    var o = { 
     posts: [] 
    }; 
    return o; 

    o.getAll = function() { 
     return $http.get('/posts.json').success(function(data){ 
      angular.copy(data, o.posts); 
     }); 
    }; 


}]) 

//Main Controller 
.controller('MainCtrl', [ 
    '$scope', 
    'posts', 

    function($scope, posts){ 
     $scope.posts = posts.posts; 
     $scope.addPost = function(){ 
      if(!$scope.title || $scope.title == '') { return; } 
      $scope.posts.push({ 
       title: $scope.title, 
       link: $scope.link, 
       upvotes: 0, 
       comments: [ 
        {author: 'Joe', body: 'Cool post!', upvotes: 0}, 
        {author: 'Bob', body: 'Great idea but everything is wrong!', upvotes: 0} 
       ] 
      }); 
      $scope.title = ''; 
      $scope.link = ''; 
     }; 
     $scope.incrementUpvotes = function(post) { 
      post.upvotes += 1; 
     }; 

    }]) 
//Posts Controller 
.controller('PostsCtrl', [ 
    '$scope', 
    '$stateParams', 
    'posts', 
    function($scope, $stateParams, posts){ 
     $scope.post = posts.posts[$stateParams.id]; 

     $scope.addComment = function(){ 
      if($scope.body === '') { return; } 
      $scope.post.comments.push({ 
       body: $scope.body, 
       author: 'user', 
       upvotes: 0 
      }); 
      $scope.body = ''; 
     };}]);

> и после application.html.erb

> Blockquote 

<html> 
<head> 


    <title>FlapperNews</title> 

    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.min.js"></script> 
    <script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.10/angular-ui-router.js"></script> 
    <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet"> 
    <script src="javascripts/app.js"></script> 
    <script src="javascripts/application.js"></script> 

    <%= csrf_meta_tags %> 
</head> 
<body ng-app="flapperNews"> 
<div class="row"> 
    <div class="col-md-6 col-md-offset-3"> 
    <ui-view></ui-view> 
    </div> 
</div> 

<script type="text/ng-template" id="/home.html"> 
    <div class="page-header"> 
    <h1>Flapper News</h1> 
    </div> 

    <div ng-repeat="post in posts | orderBy:'-upvotes'"> 
     <span class="glyphicon glyphicon-thumbs-up" 
      ng-click="incrementUpvotes(post)"></span> 
    {{post.upvotes}} 
     <span style="font-size:20px; margin-left:10px;"> 
     <a ng-show="post.link" href="{{post.link}}"> 
      {{post.title}} 
     </a> 
     <span ng-hide="post.link"> 
      {{post.title}} 
     </span> 
     </span> 
     <span> 
     <a href="#/posts/{{$index}}">Comments</a> 
     </span> 
    </div> 

    <form ng-submit="addPost()" 
     style="margin-top:30px;"> 
    <h3>Add a new post</h3> 

    <div class="form-group"> 
     <input type="text" 
      class="form-control" 
      placeholder="Title" 
      ng-model="title"> 
    </div> 
    <div class="form-group"> 
     <input type="text" 
      class="form-control" 
      placeholder="Link" 
      ng-model="link"> 
    </div> 
    <button type="submit" class="btn btn-primary">Post</button> 
    </form> 
</script> 

<script type="text/ng-template" id="/posts.html"> 
    <div class="page-header"> 
    <h3> 
     <a ng-show="post.link" href="{{post.link}}"> 
     {{post.title}} 
     </a> 
     <span ng-hide="post.link"> 
      {{post.title}} 
     </span> 
    </h3> 
    </div> 

    <div ng-repeat="comment in post.comments | orderBy:'-upvotes'"> 
     <span class="glyphicon glyphicon-thumbs-up" 
      ng-click="incrementUpvotes(comment)"></span> 
    {{comment.upvotes}} - by {{comment.author}} 
     <span style="font-size:20px; margin-left:10px;"> 
     {{comment.body}} 
     </span> 
    </div> 
    <form ng-submit="addComment()" 
     style="margin-top:30px;"> 
    <h3>Add a new comment</h3> 

    <div class="form-group"> 
     <input type="text" 
      class="form-control" 
      placeholder="Comment" 
      ng-model="body"> 
    </div> 
    <button type="submit" class="btn btn-primary">Post</button> 
    </form> 

</script> 

</body> 
</html>

источник

2015-01-27 vinibol12

От factory вы возвращающегося o перед getAll Functio n, поэтому он недоступен

.factory('posts', ['$http', function($http){ 

    var o = { 
    posts: [] 
    }; 

    //removed return 

    o.getAll = function() { 
     return $http.get('/posts.json').success(function(data){ 
     angular.copy(data, o.posts); 
     }); 
    }; 

    return o; //at the added return 
}])

источник

2015-01-27 10:06:32

Удивительный. Теперь это работает. Спасибо, кучи. – vinibol12

@ vinibol12: Добро пожаловать. Вы можете поддержать и принять в качестве ответа, если ответ помог. –

сделает это точно. Просто вы ответили менее чем через 10 минут после того, как я отправил сообщение, поэтому, похоже, у меня есть минимальное время, прежде чем я смогу его принять. – vinibol12

Угловая функция фабрики не достигнута.

ответ

Смежные вопросы