Angular2 Selector hat keine Elemente mit Bundle und ECM6 gefunden

Ich habe ein sehr einfaches angular2-Projekt, konfiguriert für die Arbeit mit Gulp, Bundle und ECM6. Bundle erstellt eine große Datei, die das übersetzte ECM5 von eckig plus meine App enthält.Angular2 Selector hat keine Elemente mit Bundle und ECM6 gefunden

<!DOCTYPE html> 
<html> 
<head> 
    <title>Angular 2 Test</title> 
    <script src="bundle.js"></script> 
</head> 

<body> 
<mainapp> 

</mainapp> 
</body> 
</html>

Die Winkel App wie folgt definiert ist:

import {Component, View, bootstrap} from 'angular2/core'; 

export class mainComponent { 
    static get annotations() { 
     return [ 
      new Component({ 
       selector: 'mainapp' 
      }), 
      new View({ 
       template: `<div>Hello!</div>` 
      }) 
     ]; 
    } 
} 

bootstrap(mainComponent);

Jedoch, wenn ich es laden, halte ich

einen Fehler auf dem Erhalten

"selector 'mainapp' did not match any element"

Quelle

2016-01-12 Senior Simone Zandara

Das Problem war, dass ich die bundle.js einschließlich wurde vor der mainapp Komponente wurde im HTML definiert. Dies behebt das Problem.

<!DOCTYPE html> 
<html> 
<head> 
    <title>Angular 2 Test</title> 

</head> 

<body> 
<mainapp> 

</mainapp> 
<script src="bundle.js"></script> 
</body> 
</html>

Update:

<script src="bundle.js" defer></script>

Scheint auch unabhängig von der Reihenfolge der Elemente das Problem zu lösen.

Quelle

2016-01-12 11:10:57

"Defer" Attribut, das dem Skript hinzugefügt wurde, hätte auch geholfen. –

das 'defer' attr löste das Problem! –

@AlexOkrushko +1 – wootscootinboogie

Angular2 Selector hat keine Elemente mit Bundle und ECM6 gefunden

Antwort

Verwandte Themen