GolDeeper

1. JSON.stringify()

2. IONIC template rendering

import { Recoder } from "./recoder.model";

export class Recoders extends Array<Recoder> {
  recoders: Recoder[];
  isEmpty: boolean;

  constructor(recoders?: Array<Recoder>) { 
    super(...recoders);
  }
}

Array<T>를 extends 할 경우 모든 배열의 기능을 사용할 수 있다.

하지만 JSON.stringify()를 사용할 경우, isEmpty와 같은 변수가 없어지는 것을 알 수 있었다.

그래서 extends 없이 기능을 구현해 보았다.

import { Recoder } from "./recoder.model";

export class Recoders {
  recoders: Recoder[];
  isEmpty: boolean;

  constructor(recoders?: Recoder[]) { 
    this.recoders = recoders;
  }

  push(recoder: Recoder) {
    this.recoders.push(recoder);
  }
  
}

이럴 경우, Template Rendering 시 오류(문제)가 발생했다.

*ngFor을 사용하여 HTML에 리스트를 뿌릴 수 없다.

service나 module은 기보적으로 싱글턴으로 작동한다.

하지만 여기서는 클래스 단위의 싱글턴을 사용할 것이다.

시간을 yyyyMMdd패턴으로 바꾸어주는 클래스를 예시로 들어보겠다.

namespace 와 export 키워드를 반드시 사용한다.

// date-formatter.ts

export namespace DateFormatterSingleton {  

    export function nowYYYYmmDD():string {
        let _temp = new Date();
        return _yyyyMMdd(_temp);
    }

    export function toYYYYmmDD(date: string):string {
        let _temp = new Date(date);
        return _yyyyMMdd(_temp);
    }

    function _yyyyMMdd(date: Date) {
        return date.getFullYear()+'-'
        +_toTwoDigits((date.getMonth()+1).toString())+'-'
        +_toTwoDigits(date.getDate().toString());
    }

    function _toTwoDigits(numeric: string):string {
        return numeric.length == 1 ? "0"+numeric : numeric;
    }
}

사용방법

import { DateFormatterSingleton } from 'src/app/model/date-formatter';

datePicker: string = DateFormatterSingleton.nowYYYYmmDD();

위 코드와 같이 사용하면된다. Java에서와 같이 getInstance()와 같은 호출은 필요없다.