Merge pull request #18 from itigoore01/refactor

itigoore01 · web-flow · commit bd2c0a128433 · 2019-02-02T00:22:47.000+09:00
refactor(lib): strictモードを有効にし、リファクタリングをしました
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -66,9 +66,19 @@
     "analyzeCommits": {
       "preset": "angular",
       "releaseRules": [
-        { "type": "docs", "scope": "lib", "release": "patch" },
-        { "type": "refactor", "release": "patch" },
-        { "type": "style", "release": "patch" }
+        {
+          "type": "docs",
+          "scope": "lib",
+          "release": "patch"
+        },
+        {
+          "type": "refactor",
+          "release": "patch"
+        },
+        {
+          "type": "style",
+          "release": "patch"
+        }
       ]
     },
     "prepare": [
diff --git a/projects/ngx-yubinbango/src/lib/address/yb-address.ts b/projects/ngx-yubinbango/src/lib/address/yb-address.ts
@@ -6,36 +6,44 @@ import { YbLocality } from './yb-locality';
 import { YbStreet } from './yb-street';
 import { YbExtended } from './yb-extended';
 import { Observable, merge, Subscription } from 'rxjs';
-import { startWith, mapTo, filter } from 'rxjs/operators';
+import { startWith, mapTo, filter, map } from 'rxjs/operators';
+
+export type YbAddressAutocompleteMode = 'change' | 'keyup' | 'off';
 
 @Directive({
   selector: '[ybAddress]',
   exportAs: 'ybAddress',
 })
 export class YbAddress implements OnDestroy, AfterContentInit {
 
-  @Input('ybAutocompleteMode') autocompleteMode: 'change' | 'keyup' | 'off' = 'keyup';
+  @Input('ybAutocompleteMode') autocompleteMode: YbAddressAutocompleteMode = 'keyup';
 
-  @ContentChildren(YbPostalCode, { descendants: true }) postalCodes: QueryList<YbPostalCode>;
+  @ContentChildren(YbPostalCode, { descendants: true }) postalCodes!: QueryList<YbPostalCode>;
 
-  @ContentChild(YbRegion) region: YbRegion;
+  @ContentChild(YbRegion) region: YbRegion | null = null;
 
-  @ContentChild(YbLocality) locality: YbLocality;
+  @ContentChild(YbLocality) locality: YbLocality | null = null;
 
-  @ContentChild(YbStreet) street: YbStreet;
+  @ContentChild(YbStreet) street: YbStreet | null = null;
 
-  @ContentChild(YbExtended) extended: YbExtended;
+  @ContentChild(YbExtended) extended: YbExtended | null = null;
 
-  private _changeSubscription: Subscription;
+  private _changeSubscription: Subscription | null = null;
 
-  private _postalCodeValueChangeSubscription: Subscription;
+  private _postalCodeValueChangeSubscription: Subscription | null = null;
 
   get postalCodeValueChanges(): Observable<string> {
-    return merge(...this.postalCodes.map(p => p._onChange));
+    return merge(...this.postalCodes.map(p => p._onChange))
+      .pipe(
+        map(v => v || ''),
+      );
   }
 
   get postalCodeKeyup(): Observable<string> {
-    return merge(...this.postalCodes.map(p => p._onKeyup));
+    return merge(...this.postalCodes.map(p => p._onKeyup))
+      .pipe(
+        map(v => v || ''),
+      );
   }
 
   constructor(
@@ -65,16 +73,12 @@ export class YbAddress implements OnDestroy, AfterContentInit {
 
     this._addressManager.getAddress(postalCode)
       .subscribe(addr => {
-        // 一旦すべてリセット
-        if (this.region) { this.region.value = ''; }
-        if (this.locality) { this.locality.value = ''; }
-        if (this.street) { this.street.value = ''; }
-        if (this.extended) { this.extended.value = ''; }
-
-        if (this.region) { this.region.value += this._addressManager.getRegion(addr); }
-        if (this.locality) { this.locality.value += this._addressManager.getLocality(addr); }
-        if (this.street) { this.street.value += this._addressManager.getStreet(addr); }
-        if (this.extended) { this.extended.value += this._addressManager.getExtended(addr); }
+        if (addr) {
+          if (this.region) { this.region.value = this._addressManager.getRegion(addr); }
+          if (this.locality) { this.locality.value = this._addressManager.getLocality(addr); }
+          if (this.street) { this.street.value = this._addressManager.getStreet(addr); }
+          if (this.extended) { this.extended.value = this._addressManager.getExtended(addr); }
+        }
       });
   }
 
@@ -91,12 +95,12 @@ export class YbAddress implements OnDestroy, AfterContentInit {
   }
 
   private _listenToPostalCode() {
-    this._postalCodeValueChangeSubscription = merge<typeof YbAddress['prototype']['autocompleteMode']>(
+    this._postalCodeValueChangeSubscription = merge<YbAddressAutocompleteMode>(
       this.postalCodeValueChanges.pipe(mapTo('change')),
       this.postalCodeKeyup.pipe(mapTo('keyup'))
     )
       .pipe(filter(mode => mode === this.autocompleteMode))
-      .subscribe((mode) => {
+      .subscribe((_) => {
         this.complete();
       });
   }
diff --git a/projects/ngx-yubinbango/src/lib/address/yb-extended.ts b/projects/ngx-yubinbango/src/lib/address/yb-extended.ts
@@ -1,4 +1,4 @@
-import { Directive, Renderer2, ElementRef, Optional, Self } from '@angular/core';
+import { Directive, Renderer2, ElementRef, Optional, Self, Inject } from '@angular/core';
 import { CompletionTarget } from '../core/common-behaviors/completion-target';
 import { NgControl } from '@angular/forms';
 
@@ -10,7 +10,7 @@ export class YbExtended extends CompletionTarget {
   constructor(
     renderer: Renderer2,
     elementRef: ElementRef,
-    @Self() @Optional() ngControl: NgControl,
+    @Inject(NgControl) @Self() @Optional() ngControl: NgControl | undefined,
   ) {
     super(ngControl, elementRef, renderer);
   }
diff --git a/projects/ngx-yubinbango/src/lib/address/yb-locality.ts b/projects/ngx-yubinbango/src/lib/address/yb-locality.ts
@@ -1,4 +1,4 @@
-import { Directive, Renderer2, ElementRef, Self, Optional } from '@angular/core';
+import { Directive, Renderer2, ElementRef, Self, Optional, Inject } from '@angular/core';
 import { CompletionTarget } from '../core/common-behaviors/completion-target';
 import { NgControl } from '@angular/forms';
 
@@ -10,7 +10,7 @@ export class YbLocality  extends CompletionTarget {
   constructor(
     renderer: Renderer2,
     elementRef: ElementRef,
-    @Self() @Optional() ngControl: NgControl,
+    @Inject(NgControl) @Self() @Optional() ngControl: NgControl | undefined,
   ) {
     super(ngControl, elementRef, renderer);
   }
diff --git a/projects/ngx-yubinbango/src/lib/address/yb-postal-code.ts b/projects/ngx-yubinbango/src/lib/address/yb-postal-code.ts
@@ -7,13 +7,13 @@ import { Subject } from 'rxjs';
 })
 export class YbPostalCode {
 
-  get value(): string {
+  get value(): string | null {
     return !!this._ngControl ? this._ngControl.value : this._elementRef.nativeElement.value;
   }
 
-  readonly _onChange = new Subject<string>();
+  readonly _onChange = new Subject<string | null>();
 
-  readonly _onKeyup = new Subject<string>();
+  readonly _onKeyup = new Subject<string | null>();
 
   constructor(
     private _elementRef: ElementRef<HTMLInputElement>,
diff --git a/projects/ngx-yubinbango/src/lib/address/yb-region.ts b/projects/ngx-yubinbango/src/lib/address/yb-region.ts
@@ -1,4 +1,4 @@
-import { Directive, ElementRef, Renderer2, Self, Optional } from '@angular/core';
+import { Directive, ElementRef, Renderer2, Self, Optional, Inject } from '@angular/core';
 import { NgControl } from '@angular/forms';
 import { CompletionTarget } from '../core/common-behaviors/completion-target';
 
@@ -10,7 +10,7 @@ export class YbRegion extends CompletionTarget {
   constructor(
     renderer: Renderer2,
     elementRef: ElementRef,
-    @Self() @Optional() ngControl: NgControl,
+    @Inject(NgControl) @Self() @Optional() ngControl: NgControl | undefined,
   ) {
     super(ngControl, elementRef, renderer);
   }
diff --git a/projects/ngx-yubinbango/src/lib/address/yb-street.ts b/projects/ngx-yubinbango/src/lib/address/yb-street.ts
@@ -1,4 +1,4 @@
-import { Directive, Renderer2, ElementRef, Self, Optional } from '@angular/core';
+import { Directive, Renderer2, ElementRef, Self, Optional, Inject } from '@angular/core';
 import { CompletionTarget } from '../core/common-behaviors/completion-target';
 import { NgControl } from '@angular/forms';
 
@@ -10,7 +10,7 @@ export class YbStreet extends CompletionTarget {
   constructor(
     renderer: Renderer2,
     elementRef: ElementRef,
-    @Self() @Optional() ngControl: NgControl,
+    @Inject(NgControl) @Self() @Optional() ngControl: NgControl | undefined,
   ) {
     super(ngControl, elementRef, renderer);
   }
diff --git a/projects/ngx-yubinbango/src/lib/core/address-manager.ts b/projects/ngx-yubinbango/src/lib/core/address-manager.ts
@@ -6,8 +6,8 @@ import { DefaultAddressManager } from './default-address-manager';
   providedIn: 'root',
   useExisting: DefaultAddressManager,
 })
-export abstract class AddressManager<T = any> {
-  abstract getAddress(postalCode: string): Observable<T>;
+export abstract class AddressManager<T = Object> {
+  abstract getAddress(postalCode: string): Observable<T | null>;
   abstract validatePostalCode(postalCode: string): boolean;
   abstract normalizePostalCode(postalCode: string): string;
   abstract getRegion(address: T): string;
diff --git a/projects/ngx-yubinbango/src/lib/core/common-behaviors/completion-target.ts b/projects/ngx-yubinbango/src/lib/core/common-behaviors/completion-target.ts
@@ -13,7 +13,7 @@ export class CompletionTarget {
     return '';
   }
   set value(value: string) {
-    if (this.ngControl) {
+    if (this.ngControl && this.ngControl.control) {
       this.ngControl.control.setValue(value);
     } else if ('value' in this.elementRef.nativeElement) {
       this.renderer.setProperty(this.elementRef.nativeElement, 'value', value);
@@ -23,7 +23,7 @@ export class CompletionTarget {
   }
 
   constructor(
-    public ngControl: NgControl,
+    public ngControl: NgControl | undefined,
     public elementRef: ElementRef,
     public renderer: Renderer2,
   ) { }
diff --git a/projects/ngx-yubinbango/src/lib/core/default-address-manager.ts b/projects/ngx-yubinbango/src/lib/core/default-address-manager.ts
@@ -8,6 +8,8 @@ import { Injectable } from '@angular/core';
 
 let nextRequestId = 0;
 
+type YubinbangoData = [number, string, string, string | undefined];
+
 /**
  * デフォルトの住所取得サービス
  */
@@ -32,7 +34,7 @@ export class DefaultAddressManager implements AddressManager<Address> {
     private http: HttpClient
   ) { }
 
-  getAddress(postalCode: string): Observable<Address> {
+  getAddress(postalCode: string): Observable<Address | null> {
     // 上3桁で検索を行う
     const topPostalCode = postalCode.substr(0, 3);
 
@@ -46,7 +48,7 @@ export class DefaultAddressManager implements AddressManager<Address> {
           concatMap(() => this.http.jsonp(`${YUBINBANGO_DATA_URL}/${topPostalCode}.js`, 'callback')),
           // リクエストが終了したので、次の番号に進める
           tap(() => this.referenceId.next(requestId + 1)),
-          map(data => {
+          map((data: Record<string, YubinbangoData>) => {
             const addresses: Record<string, Address> = {};
 
             Object.keys(data).forEach(key => {
@@ -98,13 +100,13 @@ export class DefaultAddressManager implements AddressManager<Address> {
     return address.extended;
   }
 
-  private mapAddress(obj: string[]) {
+  private mapAddress([regionId, locality, street, extended]: YubinbangoData): Address {
     return {
-      regionId: obj[0] || '',
-      region: REGION[obj[0]] || '',
-      locality: obj[1] || '',
-      street: obj[2] || '',
-      extended: obj[3] || '',
-    } as Address;
+      regionId,
+      region: REGION[regionId] || '',
+      locality,
+      street,
+      extended: extended || '',
+    };
   }
 }
diff --git a/projects/ngx-yubinbango/src/lib/models/address.ts b/projects/ngx-yubinbango/src/lib/models/address.ts
@@ -1,5 +1,5 @@
 export interface Address {
-  regionId: string;
+  regionId: number;
   region: string;
   locality: string;
   street: string;
diff --git a/tsconfig.json b/tsconfig.json
@@ -3,6 +3,7 @@
   "compilerOptions": {
     "baseUrl": "./",
     "outDir": "./dist/out-tsc",
+    "strict": true,
     "sourceMap": true,
     "declaration": false,
     "module": "es2015",
