小编给大家分享一下在Angular中APP_INITIALIZER的作用是什么，相信大部分人都还不怎么了解，因此分享这篇文章给大家参考一下，希望大家阅读完这篇文章后大有收获，下面让我们一起去了解一下吧！
在 Angular 中 APP_INITIALIZER 的作用是什么？
在官方文档是这样描述的：APP_INITIALIZER 是一个函数，在应用程序初始化时被调用。这就意味着可以通过 AppModule 类的 providers 以 factory 的形式配置它来使用，同时应用程序将会等待它加载完成后进行下一步，所以在这此只适合加载简单的数据。
示例
创建新项目
计算
安全
数据库
网络和加速
企业服务
ng new example --skip-install
npm install # yarn install配置 Provider
首先创建一个 provider ，它会在请求解析完成后返回一个 Promise 对象
@Injectable()
export class JokesProvider {
private joke:JokeModel = null;
constructor(private http:Http){
}
public getJoke(): JokeModel {
return this.joke;
}
load() {
return new Promise((resolve,reject) => {
this.http.get(url)
.map(r=>r.json())
.subscribe(r=> {
this.joke = r['value'];
resolve(true);
})
})
}
}这里会经过三个过程：
getJoke() 方法在其他组件或模块调用时直接返回 joke 当前保存的数据
私有属性 joke 会保存当前请求的数据
load() 函数会在应用程序初始时立即调用
创建Provider 工厂
export function jokesProviderFactory(provider: JokesProvider){
return () => provider.load();
}注册 JokesProvider 和 APP_INITIALIZER
@NgModule({
declarations:[
AppComponent
],
imports:[
BrowserModule,// required
HttpModule// required
],
providers: [
JokesProvider,
{
provide:APP_INITIALIZER,useFactory: jokesProviderFactory,
deps:[JoesProvider], multi:true
}
],
bootstrap:[AppComponent]
})
export class AppModule { }应用
以上是在Angular中APP_INITIALIZER的作用是什么的所有内容，感谢各位的阅读！相信大家都有了一定的了解，希望分享的内容对大家有所帮助，如果还想学习更多知识，欢迎关注亿速云行业资讯频道！
亿速云「云服务器」，即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘，价格低至29元/月。点击查看>>
免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：is@yisu.com进行举报，并提供相关证据，一经查实，将立刻删除涉嫌侵权内容。
