Angular之服务(service)
一 : 新建服务
ng g service XXXX
二 : 注册服务
这里和组件(component)不一样需要手动注册( 在app.module.ts中 )
三 : 使用服务
① , 服务类 , 自己随便写点东西
import { Injectable } from '@angular/core';@Injectable({ providedIn: 'root'})export class NewsService { constructor() {} public setLocal<DATA>( $key : string , $data : DATA ) : void{ localStorage.setItem( $key , typeof($data) === "string" ? $data : JSON.stringify($data) ); } public getLocal<DATA>( $key : string ) : DATA{ let $data : string = localStorage.getItem( $key ); return JSON.parse( $data ) as DATA; }}
② , 在组件中调用服务
import { Component, OnInit } from '@angular/core';import { UserVo } from 'src/app/demo/UserVo';import {EventMessage} from "../../lib/EventMessage";import {NewsService} from '../../services/news.service';@Component({ selector: 'app-news', templateUrl: './news.component.html', styleUrls: ['./news.component.css']})export class NewsComponent implements OnInit { ngOnInit() { } public constructor( public _newService : NewsService ){ let $arr : Array<string> = [ "Array", "[]" ]; this._newService.setLocal<Array<string>>( "user" , $arr ); let $a : Array<string> = this._newService.getLocal<Array<string>>( "user" ); //console.log( $a ); }}
注意 , 在构造函数中Angular引起会自动注入服务...
三 : 结果
声明:本站所有文章资源内容,如无特殊说明或标注,均为采集网络资源。如若本站内容侵犯了原著者的合法权益,可联系本站删除。