NGX-PARIS

###目前為0.0.6 持續更新中...

依賴於

• @angular/common
• @angular/core

安裝

npm install --save ngx-paris

Import在主要module

import { NgxParisModule } from 'ngx-paris';
@NgModule({
  declarations: [AppComponent],
  imports: [
    BrowserModule,
    NgxParisModule
  ])
export class AppModule { }

設置功能

1. HttpDefaultOptions

   • baseApiURL(string): 呼叫API的domain url
   • headers(object): 預先載入的headers

2. HttpRquestOptions

   • baseURL(string): 如有設定，則覆蓋baseApiURL
   • headers(object): 設定request http headers, 會合併預先載入的headers
   • queryObject(object): query string的物件型態
   • body(object): body

3. JWTOptions

   • key: 設定要讀取token在localstorage的key是為何

4. ConfigOptions

   • configURL: config檔的位置(*.json)

設置功能的值都可以覆寫，然後註冊在providers

export class AppHttpDefaultOptions extends HttpDefaultOptions {
  baseApiURL = 'https://test_api.com/';
  headers = {
    ['api-version']: '1.0'
  };
}

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    NgxParisModule
  ],
  providers: [{
    provide: HttpDefaultOptions,
    useClass: AppHttpDefaultOptions
  }],
  bootstrap: [AppComponent]
})
export class AppModule { }

注入服務

1. Storage:

   import { Storage } from 'ngx-paris';
   @Component({ selector: 'app-root', templateUrl: './app.component.html' })
   export class AppComponent implements OnInit {
   constructor(private stotage: Storage) {}
       ngOnInit(): void {
           this.stotage.get('key'); // 讀取localStorage
           this.stotage.set('key', obj); // 存放localStorage
           this.stotage.clear(); // 清除localStorage所有內容
       }
   }

2. Logger:

    import { Logger } from 'ngx-paris';
    @Component({ selector: 'app-root', templateUrl: './app.component.html' })
    export class AppComponent implements OnInit {
    constructor(private logger: Logger) {}
    ngOnInit(): void {
        // logger有以下六種方式可以使用
        this.logger.debug('message', 'message2', 'message3'); // 訊息可以串接, 輸出為 DEBUG: message message2 message 3
        this.logger.trace('message');
        this.logger.info('message');
        this.logger.warn('message');
        this.logger.error('message');
        this.logger.fatal('message');
        }
    }
   
   

3. Config:

    import { Config } from 'ngx-paris';
    @Component({ selector: 'app-root', templateUrl: './app.component.html' })
    export class AppComponent implements OnInit {
    constructor(private config: Config) {}
        ngOnInit(): void {
            this.config.data(); // 讀取config所有內容
            this.config.get('key'); // 針對config的欄位讀取
        }
    }
   

String擴充方法

1. toInt(radix?: number): number;
2. toFloat(): number;
3. toDate(): Date;
4. toURL(base: string): string;