0.0.8 • Published 5 years ago

ngx-paris v0.0.8

Weekly downloads
10
License
-
Repository
-
Last release
5 years ago

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');
         }
     }
```
  1. 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;