在Angular 1.2及更高版本中,此体系结构仍然有效吗?

阿多高

有很多使用$ resource的代码示例。我碰到了这个,代码也很清楚地列出了:https : //github.com/apotry/stockwatch

我喜欢这个例子,因为:

  • 它与Rails后端交互,这就是我使用Angular的方式
  • 它使用$ resource
  • 它正在使用非休息路线(ohlc)
  • 代码很干净

调用定义的函数非常简单,如下面的控制器代码所示,但是将保存内容嵌入工厂是个好主意吗?

我的问题是:既然Angular 1.2+包含了promises,这种类型的代码是否仍然有效并被认为是一种好习惯?此代码将如何响应错误状态?

这里定义了资源

app.factory('Stock', ['$resource', function($resource) {
  function Stock() {
    this.service = $resource('/api/stocks/:stockId', {stockId: '@id'}, {'update': { method: 'PUT' }});
  };
  Stock.prototype.all = function() {
    return this.service.query();
  };
  Stock.prototype.delete = function(stId) {
    return this.service.remove({stockId: stId});
  };
  Stock.prototype.create = function(attr) {
    return this.service.save(attr);
  };
  Stock.prototype.update = function(attr) {
    return this.service.update(attr);
  };
  Stock.prototype.ohlc = function(stId) {
    return $resource('/api/stocks/:stockId/ohlc', {stockId: '@id'}).get({stockId: stId});
  }
  return new Stock; 
}]);

以下是删除,创建和自定义路由(ohlc)的示例:

  $scope.requestOHLC = function (stockid) {
    return Stock.ohlc(stockid);
  }

  $scope.createStock = function() {
    $scope.fetchYahooFinanceData($filter('uppercase')    ($scope.newCompany["symbol"])).then(function(result) {
      $scope.error = false;
      $scope.stocks.push(Stock.create(result));
      $scope.newCompany = '';
    }, function(error) {
      $scope.error = true;
    });
  };

  $scope.deleteStock = function(id, idx) {
    Stock.delete(id);
    $scope.stocks.splice(idx, 1);
  };

编辑

我正在尝试制定一种简单明了的做法,以便在angular中使用基于$ resource的休息路线。

与以上代码不同,但基于此。假设下面的代码使用的服务与上面的工厂基本相同。在此示例中,我调用一个REST资源来创建新资源(rails表条目),然后将新创建的id传递给另一个调用。请注意,createPanelHeader引用$ scope.selector.paneldata.primer3_parameter_id作用域变量。不知道这是否是一个好习惯。

我发现除非使用$ promise,否则它将无法正常工作我在正确的轨道上吗?

// Section: Create Panel header
createPrimer3Parameter = function() {
    primer3_parameter = Primer3Parameter.create().$promise.then(function(primer3_parameter){
    $scope.selector.paneldata.primer3_parameter_id = primer3_parameter.id;
    createPanelHeader();
    }, function() {
      alert('Error creating primer3parameter');
    })
};

评论

我真的只是在尝试一种简单的方法来从Rails API访问REST资源,最多嵌套1级。我认为我似乎缺少了一些东西,因为这似乎非常困难。

到目前为止,我所听到的是即使在1.2以下,也不要使用$ resource。我应该改用raw $ http或Restangular。

另外,似乎还有一些1.2更改会影响Restangular。该解决方案对我来说有点像hack:

https://github.com/mgonto/restangular#using-values-direct-in-templates

更新

我并没有真正做到100%清晰,所以我发布了赏金:https//bountify.co/write-an-angular-service-for-these-rails-routes-using-restangular

吉尔·伯曼(Gil Birman)

这种类型的代码是否仍然有效并被认为是一种好习惯?

该代码有效,但从1.2.0-rc3开始被认为已弃用它将在angular 1.2和1.3的所有版本(直到但不包括1.3.0-beta10)中都可用,在该版本中已删除了自动答应解包

$scope.stocks.push(Stock.create(result));

在上面的行中,您已在上创建了一个Promise对象数组$scope然后在index.html.erb中,您直接通过stock迭代器引用了Promise:

<li ng-repeat="stock in stocks">
      <div id='symbol'>
        {{stock.symbol}}
      </div>

处理承诺的非弃用方法不允许您像这样直接绑定到承诺。

此代码将如何响应错误状态?

该应用正在此处处理错误:

}, function(error) {
  $scope.error = true;
});

和这里:

<div ng-show="error">
    There was a problem with the Yahoo Finance API. Please try again later.
</div>

对于错误处理,您不会直接与promise绑定,因此在所有版本的angular中都可以正常工作。

有更好的方法吗?

首先,在stockwatch示例中放置javascript目录结构然后,请遵循此目录结构最后,将Restangular集成到您的项目中。创建一个stockModel工厂,工厂在内部实例化一个Restangular对象,但返回在promise解析(model之后稍后将填充的对象不必在部分中绑定promise,而是绑定未填充的结果对象。

.factory('stocksModel', function (Restangular) {
  var model = {};
  var rest_stocks = Restangular.all('stocks');

  model.doSomethingRESTful = function (...) {
    // return a promise in case the controller needs it
    return rest_carts.some_restangular_method(...)
      .then(function() {
        model.some_data_which_was_acquired_RESTfully = ...;
      });
  };

  return model;
});

在您的控制器中:

$scope.stocks = stocksModel;

在您的部分中:

{{stocks.some_data_which_was_acquired_RESTfully}}

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

在Angular 1.2及更高版本中,此架构是否仍然有效?

来自分类Dev

具有Angular 1的Bootstrap Angular 2

来自分类Dev

在Angular 2中使用Angular 1库吗?

来自分类Dev

在Angular 1.x中交流组件或指令的有效方法

来自分类Dev

带有Angular JS 1或Angular JS 2的Ionic 1

来自分类Dev

Angular 2 rc 1 canActivate

来自分类Dev

Angular 2 rc 1 canActivate

来自分类Dev

最新的英特尔微体系结构中的简单解码器可以处理所有1-µop指令吗?

来自分类Dev

Angular 2 rc1中的RouteParams

来自分类Dev

Angular 2 rc1中的RouteParams

来自分类Dev

来自Angular 1背景时在Angular 2中思考

来自分类Dev

在NativeScript angular 2应用中重用angular 1模块

来自分类Dev

Angular UI Router:1条路由有效,下一条无效

来自分类Dev

在 Angular 1+ 版本之间感到困惑?

来自分类Dev

(val1> val2> val3)是C中的有效比较吗?

来自分类Dev

如何查找有关 Angular(不是 Angular 1)的信息

来自分类Dev

将Angular 1.x指令转换为Angular 2

来自分类Dev

为什么Angular 2的性能要比Angular 1更好?

来自分类Dev

将Angular 1.x指令转换为Angular 2

来自分类Dev

将Angular 1转换为Angular 2 ngInit函数

来自分类Dev

缩小Angular 2 rc1

来自分类Dev

Angular 2 rc.1 routerOnActivate

来自分类Dev

Angular2 RC.1注射

来自分类Dev

Webpack 2 Angular 1模板加载器?

来自分类Dev

在 Angular 1 中更新用户

来自分类Dev

存储在服务 Angular 1 中的 API 请求

来自分类Dev

从 Angular 1 中的注入模块访问服务

来自分类Dev

Angular 1/$interpolate - 插入数组中的元素

来自分类Dev

我可以使用 angular 版本 1 构建带有离子的应用程序吗