Ingressi angolari 2 esterni

Per favore puoi aiutare? Sto iniziando con Angular 2 e ho il seguente problema.

Il mio componente è qui sotto:

@Component({ selector: 'myapp', inputs: ['mynumber'] }) @View({ template: `

The next number is {{ mynumber + 1 }}

' }) export class App { mynumber: number; } bootstrap(App);

Dentro il mio HTML:

  

Ma quando corro ottengo il seguente:

Il prossimo numero è NaN

Sembra semplice ma mi manca qualcosa. Quello che sto cercando di ottenere è passare un valore dall’esterno dell’app al suo interno.

Grazie.

Non è ansible specificare i collegamenti di proprietà (input) per il componente root dell’applicazione. Se vuoi davvero specificare un legame per questo, dovresti usare un componente aggiuntivo. Vedi questi plunkers .

 import {Component, Input} from 'angular2/angular2' @Component({ selector: 'myapp', template: ` 

The next number is {{ mynumber + 1 }}

` }) class App { @Input() mynumber: number; } @Component({ selector: 'root', directives: [App], template: ` ` }) export class Root {}

Una soluzione alternativa è la lettura diretta usando ElementRef :

 constructor(elementRef:ElementRef) { console.log(elementRef.nativeElement.getAttribute('someattribute'); } 

e usalo come

  

Vedi anche https://github.com/angular/angular/issues/1858

Aggiornamento alle risposte usando ElementRef: utilizzare invece Renderer.selectRootElement. Chiunque stia tentando di utilizzare ElementRef.nativeElement probabilmente vedrà vari avvertimenti su come questa sia l’ultima risorsa, ecc. Ecco una versione modificata e più sicura.

 constructor( renderer: Renderer ){ let rootElement = renderer.selectRootElement('app-root'); this.whateverInput = rootElement.getAttribute('my-attribute'); } 

Per chi usa l’angular 4: se decidi di usarlo come un attributo del genere

   

Potresti semplicemente usare l’annotazione @Attribute in questo modo:

 class Component { constructor(@Attribute('attributeName') public param:String){ /** some process with your injected param **/ } } 

Testato e lavorato con successo nella mia app.

Trovato il modo lì: https://gillespie59.github.io/2015/10/08/angular2-attribute-decorator.html