Sonntag, Dezember 15, 2019

AngularJS ng-template-Richtlinie Nicht in routeProvider

Ich bin versucht, mehrere teilschablonen in einer ng-view, aber die routeProvider Richtlinien werden immer versuchen für das abrufen der Datei von dem server (nicht den embedded ng-template).

Habe ich Folgendes definiert ist in mein HTML:

<script type="text/ng-template" id="groupList.html">
  <!-- contents -->
</script>

<script type="text/ng-template" id="participantList.html">
  <!-- contents -->
</script>

<script src="js/app.js"></script> <!-- AngularJS app file -->

In meinem app.js – Datei habe ich Folgendes stehen:

var myApp = angular.module('myApp', ['ngResource', '$strap.directives']);

//Update interpolateProvider for Django server
myApp.config(function ($interpolateProvider) {
    $interpolateProvider.startSymbol('[[');
    $interpolateProvider.endSymbol(']]');
});

myApp.config(function ($routeProvider)
{
    $routeProvider.when('/', {
        templateUrl: '../static/views/home.html'
    });

    $routeProvider.when('/group', {
        controller: 'GroupCheckInCtrl',
        templateUrl: 'groupList.html'
    });

    $routeProvider.when('/group/:groupId', {
      controller: 'GroupCheckInCtrl',
      templateUrl: 'participantList.html'
    });

    $routeProvider.otherwise({
        redirectTo: '/'
    });
});

Immer wenn ich laden Sie die Seite, bekomme ich eine Fehlermeldung in meinem browser-Konsole:

GET http://127.0.0.1:8000/visitorLog/group/groupList.html 404 (NOT FOUND)

Den AngularJS-app-Sektion auf meiner Seite sieht so aus:

<div ng-app="myApp" ng-controller="GroupCheckInCtrl">
  <!-- other content -->

  <ng-view>Loading...</ng-view>

</div>

Was bin ich, dass ist nicht so dass AngularJS laden meiner ng-template Direktive script?

  • Hast du ein ng-view definiert?
  • Ja. Ich aktualisiert meine Frage zu reflektieren.

1 Kommentar

  1. 13

    stellen Sie sicher, dass die inline-Skript-tags sind die Kinder von dem element mit dem ng-app=“myApp“ – Attribut. Wenn die script-tags sind außerhalb dieses Elements, es wird nicht funktionieren. Die einfachste Möglichkeit dieses Problem zu beheben, fügen Sie die „ng-app=’myApp'“ in den tag. Hier ist ein Beispiel, was ich meine:

    <body ng-app="plunker" ng-controller="MainCtrl">
      <script type="text/ng-template" id="groupList.html">
        Group list html
      </script>
    
      <script type="text/ng-template" id="participantList.html">
        Participants list html
      </script>
      <ul>
        <li><a href="#/group">group</a></li>
        <li><a href="#/participant">participant</a></li>
      </ul>
      <div ng-view>
        Loading...
      </div>
    
    </body>

    Hier ist der entsprechende plunker: http://plnkr.co/edit/K1gMiLenRk0oPkzlGNjv

    • Genau da liegt das problem. Danke!!!

Kostenlose Online-Tests

Letzte Fragen

Tun ItemView löst Blase?

Ich habe eine CompositeView für eine Tabelle. Ich habe Trigger-set in der Kind-ItemView für jede Zeile... var TableRow = Marionette.ItemView.extend({ tagName:...

Wie kann ich untersuchen, WCF was 400 bad request über GET?

Die folgenden WCF-endpoint funktioniert gut mit dem WCF test client: AssetList ListFlaggedAssets(short processCode, string platform, string endpoint = "null", string portalId = "null", int...

Bei der Verwendung von UUIDs, sollte ich auch mit AUTO_INCREMENT?

Wir bauen eine neue web-app, die eine offline-iPad - /Android-app-version auf einer Reihe von lokalen Geräten, die Einsätze mit neuen Daten. Als solche benötigen...

Actionscript-Objekt, das verschiedene Eigenschaften

Wie kann ich die Anzahl der Eigenschaften in einer generischen Actionscript-Objekt? (Wie die Array-Länge) InformationsquelleAutor Fragsworth | 2011-01-15

Wie plot mehrere Graphen und nutzen Sie die Navigations-Taste im [matplotlib]

Die neueste version von matplotlib erstellt automatisch Navigations-buttons unter den graph. Aber die Beispiele, die ich finden alles im Internet zeigen, wie erstellen Sie...