同步功能 - 在Angular2 [英] Synchronous functions - in Angular2

问题描述

我需要在角同步功能来达到（即其他等待第一的端部）。

例如，我有两个供应商（MenuProvider和ShopProvider）。

MenuProvider有一个方法：

  getMenuItemsForCurrentShop（）
 

这是通过HTTP检索当前店铺的菜单项。

ShopProvider有一个方法：

  setCurrentShopById（idShop：数字）
 

这是通过这是目前使用的车间HTTP设置。

我需要getMenuItemsForCurrentShop（），setCurrentShopById（idShop：号码）后调用。理想的情况是没有回调。

解决方案

有在某种程度上，你将如何处理angular1 VS angular2这种情况有些不同。

有关angular1典型的方法是使用的承诺，也就是你的第一个供应商的方法将返回承诺，你要做的就是调用返回的对象。然后方法，传递回调函数将接受第一种方法的结果，你要给它里面第二种方法。

有关该技术可以看到@Pankaj答案的一个例子。

Angular2是在这种意义上的不同，因为它开始使用ReactiveExtensions库（ rx.js 的）。所以，每一个部件可能返回观测与LT; Someth＆GT; 这提供了更多的方法与它的工作相比承诺。 （您仍然可以使用与观测方法的承诺虽然）。

有关如何使用angular2 \\ HTTP模块看到另一个问题的例子：<一href=\"http://stackoverflow.com/questions/28910864/angular-2-how-to-use-import-the-http-module\">Angular 2：如何使用/导入HTTP模块

？

另外看看 HTTP模块文档在angular2

ShopApi.ts：

\r

\r

进口{注射，结合}从'angular2 / DI';\r
从angular2 / HTTP'进口{HTTP，头};\r
进口{}观测从RX;\r
   \r
@Injectable（）\r
出口类ShopApi {\r
  构造函数（公共HTTP：HTTP）{\r
  }\r
\r
  setCurrentShopById（idShop：号码）{\r
    返回this.http.get（'http://myservice.com/current/shop/'，idShop）\r
    .toRx（）\r
    .MAP（RES =＆GT; res.json（））;\r
  }\r
\r
  getMenuItemsForCurrentShop（）{\r
    返回this.http.get（'http://myservice.com/current/shop/items'）\r
    .toRx（）\r
    .MAP（RES =＆GT; res.json（））;\r
  }\r
}

\r

\r

\r

I need to reach in the angular synchronous functions (that the other waiting for the end of the first).

For example, I have two providers (MenuProvider and ShopProvider).

MenuProvider has a method :

getMenuItemsForCurrentShop()

that over HTTP retrieves the menu items for the current shop.

ShopProvider has a method:

setCurrentShopById(idShop:number)

that sets via HTTP which the shop is currently used.

I need to "getMenuItemsForCurrentShop()" called after "setCurrentShopById(idShop:number)". Ideally without callback.

解决方案

There is some difference in a way how you are going to handle this situation in angular1 vs angular2.

Typical approach for angular1 is to use promises, i e your first provider method will return promise , and all you do is call .then method on the return object, passing callback function that will accept result of first method and you will call second method inside it.

For an example of this technique you can see @Pankaj answer.

Angular2 is different in this sense as it started using ReactiveExtensions library ( rx.js ). So every component likely to return Observable<Someth> which provide a lot more methods to work with it compared to promises. (You still can use promises approach with observables though).

For an example of how to use angular2\http module see another question: Angular 2: How to use/import the http module?

Also take a look at http module docs in angular2

ShopApi.ts:

import {Injectable, bind} from 'angular2/di';
import {Http, Headers} from 'angular2/http';
import {Observable} from 'rx'; 
   
@Injectable()
export class ShopApi {
  constructor(public http: Http) {
  }

  setCurrentShopById(idShop:Number) {
    return this.http.get('http://myservice.com/current/shop/', idShop)
    .toRx()
    .map(res => res.json());
  }

  getMenuItemsForCurrentShop() {
    return this.http.get('http://myservice.com/current/shop/items')
    .toRx()
    .map(res => res.json());
  }
}

这篇关于同步功能 - 在Angular2的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！