2016-08-17 28 views
0

ist der Inhalt der Haupt-Seite:Warum funktioniert AngularJS in diesem einfachen Beispiel nicht? Diese

<html> 
    <head> 
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script> 
    </head> 
    <body> 
     <h1>Hello</h1> 
     <div ng-include="'goodbye.html'" ></div> 
    </body> 
</html> 

Dies ist der Inhalt von goodbye.html:

<h1>Goodbye</h1> 

Es zeigt nur die "Hallo" und nicht füge das "Auf Wiedersehen" hinzu. Warum enthält es nicht die Auf Wiedersehen.html?

+0

Sie nicht wirklich Bootstrap eckig in Ihrem Beispiel. Wie sieht dein JavaScript-Code aus? –

+0

@PankajParkar überprüfen Sie es jetzt. –

Antwort

3

Sie vermissen ng-app, um AngularJS zu starten.

Auch ng-schließen der Ausdruck auswerten geben, so dass Sie einen String 'goodbye.html', nicht goodbye.html

<html ng-app="example"> 
    <head> 
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script> 
     <script type="text/javascript"> 
      angular.module('example',[]); 
     </script> 
    </head> 
    <body> 
     <h1>Hello</h1> 
     <div ng-include="'goodbye.html'"></div> 
    </body> 
</html> 
+0

Lieber, du legst deine ng-app Direktive einfach bevor du die angular in deine Seite geladen hast ... nein das funktioniert nicht ... –

+0

Sorry, es hat nicht funktioniert, sondern weil ich 'Beispiel' nicht initialisiere module und ng-include werten den übergebenen Ausdruck aus, so dass du eine Zeichenfolge "Goodbye.html" und nicht "Goodbye.html" übergeben musst. Ich habe meine Antwort bearbeitet. – Drkdra

+0

es funktioniert, danke, aber es klingt nicht Gotcha oder überflüssig, um diese Initiation Skript zu haben, könnte es viel sauberer sein, ohne dass ... –

1

Verwenden '' im ng-include

<div ng-include="'goodbye.html'" ></div> 

Vom Documentation

passieren müssen

Angular Ausdruck Bewertung zu URL Wenn die Quelle eine Zeichenkette Konstante ist, stellen Sie sicher, dass Sie sie in einfache Anführungszeichen setzen, z. src = "'myPartialTemplate.html'".

+0

nein hatte ich schon diese '' und es hat nicht funktioniert ... –

+0

zu sehen die Struktur Ihrer Dateien. Sind sie auf dem gleichen Level? –

1

Nach dem Betrachten Ihrer HTML scheint es, dass Ihre Anwendung nicht automatisch bootstrappt. Es kann sein, dass Sie Ihre Anwendung manuell starten. Eine andere Sache, die ich bemerkte, ist die ng-include takes Pfad Ihres Include html als Zeichenfolge wie ..

+0

Vielen Dank für Ihre Teilnahme, die Antwort von Drkdra hat funktioniert ... –

Verwandte Themen