[Angular] Providers and useFactory
// service.ts import { Injectable, Inject } from '@angular/core';
import { Http } from '@angular/http'; import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/map'; @Injectable()
export class FoodService {
constructor(
private http: Http,
private api: string
) {
console.log(this.api);
}
getFood(): Observable<any[]> {
return this.http.get(this.api)
.map(response => response.json());
}
}
Using factory provider:
import { Component, OnInit } from '@angular/core';
import { Http } from '@angular/http'; import { Observable } from 'rxjs/Observable'; import { FoodService } from '../food.service'; interface Drink {
name: string,
price: number
} export function DrinkFactory(http) {
return new FoodService(http, '/api/drinks');
} @Component({
selector: 'drink-viewer',
providers: [
{
provide: FoodService,
useFactory: DrinkFactory,
deps: [
Http
]
}
],
template: `
<div>
<div *ngFor="let item of items$ | async">
{{ item.name }} {{ item.price | currency:'USD':true }}
</div>
</div>
`
})
export class DrinkViewerComponent implements OnInit {
items$: Observable<Drink[]>;
constructor(private foodService: FoodService) {}
ngOnInit() {
this.items$ = this.foodService.getFood();
}
}
Here we create 'DrinkFactory' as a named funciton, this is good for AOT, so recommended doing this way.
[Angular] Providers and useFactory的更多相关文章
- 来自 Thoughtram 的 Angular 2 系列资料
Angular 2 已经正式 Release 了,Thoughtram 已经发布了一系列的文档,对 Angular 2 的各个方面进行深入的阐释和说明. 我计划逐渐将这个系列翻译出来,以便对大家学习 ...
- [Angular 2] Value Providers & @Inject
Dependecies aren’t always objects created by classes or factory functions. Sometimes, all we really ...
- [Angular 2] Inject Service with "Providers"
In this lesson, we’re going to take a look at how add a class to the providers property of a compone ...
- Angular之Providers (Value, Factory, Service and Constant )
官方文档Providers Each web application you build is composed of objects that collaborate to get stuff do ...
- 在Angular中定义共享的Providers
转自:https://segmentfault.com/a/1190000010700308 有时,你需要在 Angular 应用中创建一个共享模块,该模块定义了功能模块和lazy-loaded模块可 ...
- [Angular 2] BYPASSING PROVIDERS IN ANGULAR 2
Artical --> BYPASSING PROVIDERS IN ANGULAR 2 Here trying to solve one problem: On the left hand s ...
- [Angular] Pipes as providers
In this example, we are going to see how to use Pipe as providers inject into component. We have the ...
- Angular:ViewProviders和Providers的区别
在Angular中使用依赖注入(DI)的时候,我们一般会使用providers.其实要做同样的事我们还有另外一个选择:viewProviders. viewProviders允许我们定义只对组件的vi ...
- [Angular] Difference between Providers and ViewProviders
For example we have a component: class TodoList { private todos: Todo[] = []; add(todo: Todo) {} rem ...
随机推荐
- .Net中的缓存依赖配置
缓存--能非常好的提高网站的性能. 在訪问量大,但更新较少的站点中使用缓存,能够大大提高执行效率. 在.net中给我们提供了非常好的缓存机制.页面缓存.数据缓存,还有非常好的依赖缓存. 依赖缓存优点就 ...
- win7-时间更新
今天发现电脑的时间不对,后来就自己摸索了时间的自动更新方法.自己记录下来,以方便以后忘了查询 点击电脑右下角的时间->选择更改日期和时间设置->选择internet->更改设置-&g ...
- 李笑来~执行力WWH
什么是秘密 秘密是指只有极少数人知道的实用信息.这个实用信息可以为知道且懂得运用的人获得收益,这个收益可能包括钱.名声和快感. 什么是执行力 执行力=What + Why + How,即WWH 执行力 ...
- 27.mutex跨进程通信
创建互斥量mutex HANDLE mutex = CreateMutexA(NULL, TRUE, name); 根据id打开mutex HANDLE mutex = OpenMutexA(MUTE ...
- 3.1 Broker Configs 官网剖析(博主推荐)
不多说,直接上干货! 一切来源于官网 http://kafka.apache.org/documentation/ 3.1 Broker Configs 3.1 broker配置 The essent ...
- Python Jsonpath模块用法
在使用Python做自动化校验的时候,经常会从Json数据中取值,所以会用到Jsonpath模块,这里做个简单的总结 1.关于jsonpath用来解析多层嵌套的json数据;JsonPath 是一种信 ...
- unity-unet-同步各个player唯一标识
Multiplayer Game 中所有 player 都有一个唯一标识.在unet中可以通过 Network Identity 组件获取到该 player 在整个网络整的 唯一 的连接 id 这里测 ...
- 14.inline与namespace使用
#include <iostream> using namespace std; namespace all { //inline作用为默认调用 inline namespace V201 ...
- JavaScript篇(一)二叉树的插入 (附:可视化)
一.二叉树概念 二叉树(binary tree)是一颗树,其中每个节点都不能有多于两个的儿子. 字节一面,第一道就是二叉树的插入,在这里其实是对于一个二叉查找树的插入. 使二叉树成为二叉查找树的性质是 ...
- Spring MVC基础了解
参考网址:https://www.yiibai.com/spring_mvc/springmvc_overview.html Spring框架相关 Spring Security 一个灵活强大的身份验 ...