When we create a Service, Angluar CLI will helps us to add:

@#Injectable({
providedIn: 'root'
})

It only create a instance in root dependency tree. If there is no reference to use this provider, Angular will remove it from our production code.

But the service we created are Class based service, what if we want to create some Object and inject this Object to our application and we want to make it tre shakable as well.

We can do as following:

import { InjectionToken } from "@angular/core";
export interface AppConfig {
apiUrl: string;
courseCacheSize: number;
} export const APP_CONFIG: AppConfig = {
apiUrl: "http://localhost:9000",
courseCacheSize:
}; // Use providedIn & factory to make it as tree shakable provider.
export const CONFIG_TOKEN = new InjectionToken<AppConfig>("CONFIG_TOKEN", {
providedIn: "root",
factory: () => APP_CONFIG
}); // Not tree shakable
// export const CONFIG_TOKEN = new InjectionToken<AppConfig>("CONFIG_TOKEN");

Whereever you use the provider, you need to remove it:

@Component({
selector: "app-root",
templateUrl: "./app.component.html",
styleUrls: ["./app.component.css"],
// Remove it when need to use tree shakable provider
providers: [{ provide: CONFIG_TOKEN, useValue: APP_CONFIG }]
})

[Angular] Tree shakable provider的更多相关文章

  1. angular factory Services provider 自定义服务 工厂

    转载于 作者:海底苍鹰地址:http://blog.51yip.com/jsjquery/1602.html 1.在app.js 中声明了模块的依赖 var phonecatApp = angular ...

  2. [Angular 2] Factory Provider

    In this lesson, we discuss how and when to use factory providers, to enable dependencies that should ...

  3. Angular 学习笔记——$provider

    <!DOCTYPE HTML> <html ng-app="myApp"> <head> <meta http-equiv="C ...

  4. ionic准备之angular基础———服务provider 和 factory和service(9)

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. 生成树形结构的json字符串代码(c#)供前端angular tree使用.

    框架是使用EF6.0.可以针对返回的值使用Newtonsoft.Json.dll(百度搜一下)来对返回的值序列化为json字符串,如果对以下值那就是使用JsonConvert.SerializeObj ...

  6. [Angular 2] Factory Provider with dependencies

    This lesson discusses when and how to add dependencies, resolved by Angular’s DI, to factory provide ...

  7. [Angular] Using useExisting provider

    Unlike 'useClass', 'useExisting' doesn't create a new instance when you register your service inside ...

  8. angular内置provider之$compileProvider

    一.方法概览 directive(name, directiveFactory) component(name, options) aHrefSanitizationWhitelist([regexp ...

  9. angular service provider

    关于  angular service factory  provider 方面有很多,我也来写一篇加深下印象 provider 是一切方法的基础,所以功能也最强,provider 用来定义一个可以被 ...

随机推荐

  1. 3.shell位置参数变量

    当我们执行一个shell脚本时,希望可以获取命令行里的参数信息,就可以使用位置参数变量.比如 sh ./a.sh 100 200,就是一个执行shell的命令行,可以在a.sh脚本中获取到参数信息 语 ...

  2. selenium 消息框元素定位处理

    以下内容来自于“风少”的博客 <元素定位:selenium消息框处理 (alert.confirm.prompt)> 基础普及 alert对话框 .细分三种,Alert,prompt,co ...

  3. django使用celery进行耗时任务的优化

    # 原创,转载请留言联系 在用django做项目的时候,做到注册模块时,需要发送短信验证码.本来简简单单的做好了,后来优化的时候发现,发送短信验证码的时候需要一点时间,在这个时间之内程序是阻塞的,用户 ...

  4. HDU-3555

    Bomb Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 131072/65536 K (Java/Others)Total Submi ...

  5. UVALive - 5844

    题是pdf版 Sample Input23mississippinni55i55ippi2foobar|=o08arSample Output10 /** 题意:给出一个normal串,一个leet串 ...

  6. python encode和decode函数说明

    字符串编码常用类型:utf-8,gb2312,cp936,gbk等. Python中,我们使用decode()和encode()来进行解码和编码 在python中,使用unicode类型作为编码的基础 ...

  7. Selenium2+python自动化48-登录方法(参数化)【转载】

    前言 登录这个场景在写用例的时候经常会有,我们可以把登录封装成一个方法,然后把账号和密码参数化,这样以后用的登录的时候,只需调用这个方法就行了 一.登录方法 1.把输入账号.输入密码.点击登录按钮三个 ...

  8. ubuntu 16.04安装redis(源码安装)zz

    本文转载自: http://www.linuxdiyf.com/linux/22527.html Redis是一个开源的使用ANSI C语言编写.支持网络.可基于内存亦可持久化的日志型.Key-Val ...

  9. ssl介绍以及双向认证和单向认证原理

    SSL安全证书可以自己生成,也可以通过第三方的CA(Certification Authority)认证中心付费申请颁发. SSL安全证书包括: 1.       CA证书,也叫根证书或中间级证书.单 ...

  10. MYSQL的内外连接

    1.内联接(典型的联接运算,使用像 =  或 <> 之类的比较运算符).包括相等联接和自然联接.     内联接使用比较运算符根据每个表共有的列的值匹配两个表中的行.例如,检索 stude ...