La parte della sintassi Angular 2 @Component di ES6?

Question

Qualcuno può dirmelo. Il simbolo '@' davanti alla funzione Componente importata. È la sintassi ES6? Non l'ho visto usato su altri progetti ES6 non angolari che ho visto.

import {Component} from ... 
@Component({}) 

Here is a example

Answer 1

Risposta breve: No.

Il @ sintassi definisce un'annotazione - questo è stato introdotto da angolare di AtScript, che successivamente incorporata in TypeScript. Da quello che posso vedere, sono simili alle annotazioni nei linguaggi .NET.

annotazioni non sono una parte di ES6 di serie; sono semplicemente una decorazione fornita da TypeScript. Da notare, Angular 2 supporta l'uso delle annotazioni TypeScript, così come Aurelia.

non posso fornire un collegamento al momento, ma ci sono le risorse che descrivono le caratteristiche e le componenti linguistiche ES6 in grande dettaglio.

Answer 2

La sintassi @ fa parte di un nuovo progetto per l'ES7 che è attualmente in fase 1 (fase di proposta). Sono chiamati decoratori.

I decoratori consentono di annotare e modificare classi e proprietà in fase di progettazione.

Per ulteriori informazioni si veda: https://github.com/wycats/javascript-decorators

---

Nota: è possibile utilizzare decoratori, utilizzando Babel attivando il optional[]=es7.decorators (in webpack) o impostando la configurazione a stage:1

Answer 3

Solo per la record, è possibile ottenere lo stesso comportamento in ES6 semplicemente traducendo l'annotazione dattiloscritto nelle seguenti:

import {Component, ...} from 'angular2/core'; 
export class myAppOrDirective { 
    static get annotations() { 
     return [ 
      new Component({ 
       selector: 'my-app-or-directive' 
      }), 
      new View({ 
       template: `<div>Hello!</div>` 
      }) 
     ]; 
    } 
}