​

一、HTTP

a)Angular提供了自己的HTTP库来调用外部API，为了能够在等待API响应的过程中继续与界面交互，采用异步HTTP请求的方式。

b)Get请求，首先导入Http, Response，http.request方法返回Observable类型，所以可以使用Observable.subscribe来订阅请求响应，达到异步的效果。

import{ Http, Response } from '@angular/http';

…

this.http.get('http://jsonplaceholder.typicode.com/gets/1')

.subscribe((res:Response) => {

  this.data = res.json();

});

c) 其它类型的请求，可以使用对应的方法，如http.Post\Delete\Put等，但Post之类的请求会要求第二个参数，以传入修改的内容：

this.http.post(

  'http://jsonplaceholder.typicode.com/posts',

  JSON.stringify({

    body: 'bar',

    title: 'foo',

    userId: 1

  }))

  .subscribe((res: Response) => {

    this.data = res.json();

 });

这里将要提交的对象使用JSON.stringify进行了转换。

二、Routing

a)Web应用会被划分为各种区域和层级，根据路由的规则，可以让URL访问到指定的内容。

定义路由的方式为：

import{ Routes, RouterModule } from '@angular/router';

…

constroutes: Routes = [

  { path: 'home', component: AppComponent }

{ path: 'contactus',redirectTo: 'home'},

]

…

@NgModule({

  …

  imports: [RouterModule.forRoot(routes)],

})

创建Routes配置对象后，使用RouterModule.forRoot(routes)安装配置。在配置对象中，path定义了路由要处理的URL，component指定了对应的符合对应路由的URL请求由哪个组件处理。还可以使用redirectTo进行重定向。

b)routerLink和router-outlet

 

Router Sample

 

    Home

    About Us

    Contact Us