Как декоратор применяется к классам в угловых в случае нескольких классов

Question

Мы используем @decorator для определения декораторов классов.

Но что, если у нас есть несколько декораторов и несколько классов в одном файле, как декоратор отображается на их класс?

Или мы не можем использовать несколько декораторов в одном файле?

Answer 1

Или мы не можем использовать несколько декораторов в одном файле?

Да, вы можете использовать несколько декораторов в одном файле. Вы даже можете использовать несколько декораторов в одном объявлении класса, см. Ниже.

Как декоратор сопоставлен с их классом?

Декоратор на самом деле является функцией. Он отображается в декларации рядом с ним.

Из Руководства по TypeScript - Документы для декораторов:

Декораторы

Декоратор - это специальный вид объявления, который может быть присоединен к объявлению класса, методу, методу доступа, свойству или параметру. Декораторы используют форму @expression, где expression должен оценить функцию, которая будет вызываться во время выполнения с информацией об оформленном объявлении.

Например, учитывая декоратор @sealed мы могли бы написать sealed функционировать следующим образом:

function sealed(target) {
    // do something with 'target' ...
}

Итак, опять же, вы можете иметь несколько декораторов в одном файле, и они применяются к объявлению класса, методу, аксессору, свойству или параметру рядом с ним.

Runnable Demo

Демо-версия всегда приветствуется, вот она.

В следующем коде каждый декоратор напечатает сообщение для каждого класса, который он декорирует. Как видите, несколько декораторов для одного класса, несколько классов, все в одном файле.

function MyDecoratorOne(target) {
  console.log('MyDecoratorOne decorating class: ' + target.name);
}
function MyDecoratorTwo(target) {
  console.log('MyDecoratorTwo decorating class: ' + target.name);
}

@MyDecoratorOne
@MyDecoratorTwo
class Aaa {
  aaaMethod() {}
}

@MyDecoratorOne
@MyDecoratorTwo
class Bbb {
  bbbMethod() {}
}

Выход:

MyDecoratorTwo decorating class: Aaa
MyDecoratorOne decorating class: Aaa
MyDecoratorTwo decorating class: Bbb
MyDecoratorOne decorating class: Bbb

ДЕМО JSFiddle здесь.