Связывание не работает между представлением и контроллером

Question

Я только начал развиваться в Mean.js и немного проблем с угловой частью.

Ive создал api в узле, который может выполнять базовую crud с моделью рецепта.

Теперь я пытаюсь отобразить список существующих рецептов.

Контроллер:

'use strict'; 

angular.module('recipe').controller('RecipeController', ['$scope', 'RecipeService', 
    function ($scope, RecipeService) { 
    // Recipe controller logic 
    var vm = this; 

    vm.recipes = RecipeService.query(); 
    } 
]); 

Вид:

<section data-ng-controller="RecipeController"> 
    <div data-ng-repeat="recipe in vm.recipes"> 
    {{recipe.title}} 
    </div> 
</section> 

Услуги:

'use strict'; 

angular.module('recipe').factory('RecipeService', [ '$resource', 
    function ($resource) { 
    // Recipe service logic 
    var Recipe = $resource('api/recipes/:recipeId', { 
     recipeId: '@_id' 
    }, { 
     update: { 
     method: 'PUT' 
     } 
    }); 

    angular.extend(Recipe.prototype, { 
     createOrUpdate: function() { 
     var recipe = this; 
     return createOrUpdate(recipe); 
     } 
    }); 

    function createOrUpdate(recipe) { 
     if(recipe._id) { 
     return recipe.$update(onSuccess, onError); 
     } else { 
     return recipe.$save(onSuccess, onError); 
     } 

     function onSuccess(recipe) { 

     } 

     function onError(errorResponse) { 
     var error = errorResponse.data; 
     handleError(error); 
     } 
    } 

    function handleError(error) { 
     console.log(error); 
    } 

    // Public API 
    return Recipe; 
    } 
]); 

Так что, когда я утешаю войти в vm.recipe в контроллере, а затем посмотрим после асинхронном вызов будет обрабатывать вещи, я увижу 2 результата в vm.recipes, что является правильным, так как у меня есть 2 результата в БД. Это доказывает, что сервис работает нормально и загружает данные. Кроме того, похоже, что в контроллере все в порядке, так как оно будет извлекать данные там. Но эти данные не будут загружены в поле зрения, и я понятия не имею, почему. Представление правильно выбрано в конфигурации.

У кого-нибудь есть идеи?

Answer 1

Хорошо, не выяснил, почему он не работает в этой форме, но Ive смог заставить его работать, просто поместив рецепты в свойство $ scope.

'use strict'; 

angular.module('recipe').controller('RecipeController', ['$scope', 'RecipeService', 
    function ($scope, RecipeService) { 
    // Recipe controller logic 
    $scope.recipes = RecipeService.query(); 
    } 
]); 

Answer 2

пожалуйста, попробуйте этот

на месте

var vm = this; 

vm.recipes = RecipeService.query(); 

пытаются использовать

$scope.recipes = RecipeService.query(); 

в контроллере

и в HTML в место только