데코레이터 실행 순서는 무엇입니까?

Question

왜 결과가 "구성 요소 앞의 지시문"인지 이해할 수 없습니다.

function Component(component) { 
    console.log('selector: ' + component.selector); 
    console.log('template: ' + component.template); 
    console.log('component init'); 
    return (target: any) => { 
     console.log('component call'); 
     return target; 
    } 
} 

function Directive() { 
    console.log('directive init'); 
    return (target: any) => { 
     console.log('directive call'); 
     return target; 
    } 

} 

@Component({selector: 'person',template: 'person.html'}) 
@Directive() 
class Person {} 

let p = new Person(); 

출력 :

selector: person 
template: person.html 
component init 
directive init 
directive call 
component call 

가 component call이 directive call 전에해야하지?

Answer 1

데코레이터 : 기본적으로

@C 
@D 
class Person {} 

는 유사 뭔가된다.
데코레이터 자체 가기 반대 방향으로 실행, 하단 : 당신의 예에서

@a @b x 
// bit like 
{ 
    const decA = a 
    const decB = b 
    decA(decB(x)) 
} 

{ 
    const decComp = Component({selector: 'person', template: 'person.html'}) 
    // selector: person 
    // template: person.html 
    // component init 
    const decDirective = Directive() 
    // directive init 
    decComp(decDirective(Person)) 
    // directive call 
    // component call 
} 

Reference

Answer 2

지시문 호출 전에 구성 요소 호출을 사용해야합니까?

아니요. 내부는 외부로 호출됩니다. 표현은 위에서 아래로 불러 장식을 생산받을

C(D(class Person()))