angular 裝飾器（注解）

• 裝飾器/注解 就是一個函數
• 但它是一個返回函數的函數
• 它是TypeScript 的一個特性，而非Angular 的特性

  @Emoji() result = 'Hello';

export function Emoji() {
  return (target: object, key: string) => {
    let val = target[key];

    const getter = () => {
      return val;
    };

    const setter = (value: string) => {
      val = `/笑哭 ${value} /笑哭`;
    };

    Object.defineProperty(target, key, {
      get: getter,
      set: setter,
      enumerable: true,
      configurable: true
    });
  };
}

 

<p (click)="handleClick()">你好</p>

@Confirmable('確定執行當前操作？')
  handleClick() {
    console.log('點擊已執行');
  }

export function Confirmable(message: string) {
  return (target: object, key: string, descriptor: PropertyDescriptor) => {
    const original = descriptor.value;
    descriptor.value = function (...args: any) {
      const allow = window.confirm(message);
      if (allow) {
        const result = original.apply(this, args);
        return result;
      }
      return null;
    };
    return descriptor;
  }
}