【问题标题】:Recommended way of getting data from the server从服务器获取数据的推荐方式
【发布时间】:2012-08-04 16:58:55
【问题描述】:

在不使用$resource 的情况下,在AngularJS 中连接服务器数据源的推荐方法是什么。

$resource 有很多限制,例如:

  1. 没有使用正确的期货
  2. 不够灵活

【问题讨论】:

  • 鉴于此问题(https://github.com/angular/angular.js/issues/415) 已关闭,$resource 是否仍然存在不使用正确期货的限制? (我是 Angular 的新手,如果问题令人困惑,我深表歉意。)编辑 - 这个提交 (github.com/angular/angular.js/commit/…) 似乎也表明 $resource 可能不再有这个限制了?
  • 那么在这里回答您自己的问题是合法的..好吗?按“”,这就是所谓的“分享你的知识”

标签: angularjs


【解决方案1】:

在某些情况下,$resource 在与后端通信时可能不合适。这显示了如何在不使用资源的情况下设置类似 $resource 的行为。

angular.module('myApp').factory('Book', function($http) {
  // Book is a class which we can use for retrieving and 
  // updating data on the server
  var Book = function(data) {
    angular.extend(this, data);
  }

  // a static method to retrieve Book by ID
  Book.get = function(id) {
    return $http.get('/Book/' + id).then(function(response) {
      return new Book(response.data);
    });
  };

  // an instance method to create a new Book
  Book.prototype.create = function() {
    var book = this;
    return $http.post('/Book/', book).then(function(response) {
      book.id = response.data.id;
      return book;
    });
  }

  return Book;
});

然后在您的控制器中,您可以:

var AppController = function(Book) {
  // to create a Book
  var book = new Book();
  book.name = 'AngularJS in nutshell';
  book.create();

  // to retrieve a book
  var bookPromise = Book.get(123);
  bookPromise.then(function(b) {
    book = b;
  });
};

【讨论】:

  • 也许是一个菜鸟问题,但是如何扩展它以允许 get() 返回多个响应而不仅仅是单个响应?
  • @NathanBunney,您可以让上面的静态 get 方法循环遍历结果并构建书籍数组。
  • @NathanBunney ' Book.getAll = function() { return $http.get('/Book').then(function(response) { var books = []; for(var i = 0 ; i
  • 如何在控制器之间共享bookbooks 集合?
  • 这很棒(显然是因为 Misko 创建了框架),但我正在努力弄清楚如何使其可重用。如果我只想实现一次 CRUD 函数,然后在只需要 urlBase 参数的子工厂/服务中继承它们的功能(最好存储在原型上,这样每个实例都不需要 urlBase 的新副本),如何我这样做?
【解决方案2】:

我建议你使用$resource

它可能会在 Angularjs 的下一个版本中支持(url 覆盖)。 然后你就可以编写这样的代码了:

// need to register as a serviceName
$resource('/user/:userId', {userId:'@id'}, {
    'customActionName':    {
        url:'/user/someURI'
        method:'GET',
        params: {
            param1: '....',
            param2: '....',
        }
    },
     ....
});

并且返回回调可以像这样在 ctrl 范围内处理。

// ctrl scope
serviceName.customActionName ({
    paramName:'param',
    ...
}, 
function (resp) {
    //handle return callback
}, 
function (error) {
    //handler error callback
});

也许您可以处理更高抽象级别的代码。

【讨论】:

  • 当前版本的 angular.js 支持 $resource 模块中的 url 覆盖。
  • 哈哈,你正在推荐框架的实际创建者如何做某事:P
  • 天啊!我感到很惭愧。
猜你喜欢
  • 2020-06-15
  • 2017-07-09
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2014-10-25
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多