Angular4.x 创建使用服务

一、Angualr CLI 创建服务

二、创建服务命令

ng g service my-new-service

创建到指 定目录 下面

ng g service services/storage

三、app.module.ts 里面引入创建的服务

1.app.module.ts 里面引入创建的服务

import { StorageService } from './services/storage.service';

2. NgModule 里面的 providers 里面依赖注入服务

@NgModule({

declarations: [ AppComponent, HeaderComponent,

FooterComponent, NewsComponent, TodolistComponent ],

imports: [ BrowserModule, FormsModule ],

providers: [StorageService], bootstrap: [AppComponent] }) export class AppModule { }

四、使用的页面引入服务，注册服务

import { StorageService } from '../../services/storage.service';

constructor(private storage: StorageService) {

}

使用

addData(){ // alert(this.username);

this.list.push(this.username);

this.storage.set('todolist',this.list); } removerData(key){

console.log(key); this.list.splice(key,1); this.storage.set('todolist',this.list);

}