Quelle est la commande en cours du décorateur?

Je ne comprends pas pourquoi le résultat est "directive avant le composant".Quelle est la commande en cours du décorateur?

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();

Sortie:

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

pas Si le component call être avant directive call?

Source

2017-10-15 Hao

Pourquoi pensez-vous que? Les décorateurs s'appliquent à la chose en dessous d'eux, ils sont donc appliqués "à l'envers". – jonrsharpe

Je l'ai lu de quelque part, décorateur va de gauche à droite, de haut en bas – Hao

Ceci est directement couvert dans le manuel https://www.typescriptlang.org/docs/handbook/decorators.html#decorator-composition –

Le décorateur expressions s'appellent haut en bas, et produisent des décorateurs.
Les décorateurs eux-mêmes course dans le sens opposé, bas en haut:

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

Dans votre exemple

{ 
    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

Source

2017-10-15 23:40:56 HTNW