一 : 新建服务
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引起会自动注入服务...
三 : 结果
亿速云「云服务器」,即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘,价格低至29元/月。点击查看>>
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。