访问$ resource.query()中的第一项 - Angularjs

时间:2014-05-24 14:16:51

标签: angularjs express pug

我在使用$ resource.query()方法时遇到了一些问题。我正在尝试访问其中的第一个元素,但它不适合我。选择控制器返回集合没有问题。

controller.js

angular.module('bookshelf').controller('bsMainCtrl', function($scope, bsBooks){
  var data = bsBooks.query();
  $scope.singleBook = data[0];
});

angular.module('bookshelf').controller('bsSelectionCtrl', function($scope, bsBooks){
  var booksData = bsBooks.query();

  $scope.books = booksData;
});

main.jade

.singleBook
  .selection
    include selection
  .content
    include book-list

图书-list.jade

div(ng-controller='bsMainCtrl') 
  p Title: {{ singleBook.title }}
  p Author: {{ singleBook.author }}
  p ISBN: {{ singleBook.ISBN }}
  p Created at: {{ singleBook.createdAt | date }}
  a(ng-href='/edit/{{ singleBook._id }}') Edit

selection.jade

div(ng-controller="bsSelectionCtrl")
  div(ng-repeat='book in books')
    button(ng-click='selectBook()') {{ book.title }}

service.js

angular.module('bookshelf').factory('bsBooks', function($resource) {
  var BookshelfResource = $resource('/api/books/:_id', {_id: "@id" }, {
    update: {method: 'PUT', isArray: false}
  });

  return BookshelfResource;
});

route.js

exports.getBooks = function(req, res){
  Book.find({}).exec(function(err, collection){
    res.send(collection);
  });
};

Angular $范围是否相关?我尝试过使用Angular检查器,但只能得出结论:singleBook为null。

2 个答案:

答案 0 :(得分:2)

$resource.query()返回一个最初不包含数据的promise,因此您无法在您尝试的位置通过编号索引访问它。

尝试改为:

bsBooks.query().$promise.then(function(data){
  $scope.singleBook = data[0];  
});

Demo

答案 1 :(得分:0)

对来自服务器的等待数据使用回调或承诺

var data = bsBook.query(function(){ 
   $scope.singleBook = data[0]; 
}) 

请参阅here