Angular权威教程阅读总结（3）—— Http & Router

最新推荐文章于 2024-07-07 12:01:19 发布

bkjs626

最新推荐文章于 2024-07-07 12:01:19 发布

阅读量284

点赞数

分类专栏： Angular 文章标签： Angualr

本文链接：https://blog.csdn.net/bkjs626/article/details/79829288

版权

本文主要探讨Angular的Http模块和路由。在Http模块中，介绍了基本请求、常量注入、ngOnInit及其作用，以及POST、PUT等HTTP方法的使用。在路由部分，讲解了SPA应用的演进，包括锚标记法和HTML5客户端路由，详细阐述了路由配置、routerLink指令、路由参数和查询参数，还涉及了路由守护和嵌套路由的概念。

摘要由CSDN通过智能技术生成

Http模块

首先要注意的是把HttpModule作为依赖项，加入NgModule的imports列表中，这样就可以把Http（和另外一些模块）导入组件之中。

pre标签：保存换行、空白符，可用于展示代码。

基本请求

this.http.request('http://jsonplaceholder.typicode.com/posts/1')
    .subscribe((res: Response) => {  this. data = res.json(); })

http.request返回一个Response对象，用subscribe订阅变化，然后用json方法提取出响应体并解析成一个Object。

Subscribe同样可以处理失败和流完结的清空，只要分别在第二和第三个参数中传入一个函数就可以。

Subscribe接受三个参数：onSuccess，onError和onCompletion

常量注入

当需要解决一些环境配置问题的时候，我们可以让这些变量变得可被注入。为什么需要注入这些常量而不是像平常一样直接用？这是因为只要让这些变量可被注入，就能够：

让代码在部署的时候根据所选的环境注入正确的变量。
在测试期更容易替换要注入的值。

我们使用 { provide: … , useValue: … } 语法。

export var injectables: Array<any> = [
    {
  provide: MyService, useClass: MyService},
    {
  provide: MY_KEY, useValue: MY_KEY},
    {
  provide: MY_URL, useValue: MY_URL}