2017-09-04 3 views
0

Der Versuch, ein einfaches Routing-Beispiel zu replizieren w3schools, aber es stürzt mit "RangeError: Maximale Call-Stack-Größe überschritten" in der Konsole beim Zugriff auf index.html ab.ng-view führt zum Absturz der Seite

Ich habe versucht, Teile des Codes hinzuzufügen/zu entfernen, um das Problem zu isolieren, und der Absturz scheint bei <div ng-view></div> passieren. Warum das? Die Änderungen, die ich am ursprünglichen Beispiel vorgenommen habe, sind nicht so drastisch. Hier

ist der Code

index.html

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular-route.js"></script> 
<script src="app.js"></script> 

</head> 

<body ng-app="myApp"> 

<a href="#!red">Red</a> 
<a href="#!green">Green</a> 

<div ng-view></div> 

</body> 
</html> 

app.js

var app = angular.module("myApp", ["ngRoute"]); 
app.config(function($routeProvider) { 
    $routeProvider 
    .when("/", { 
     templateUrl : "index.html" 
    }) 
    .when("/red", { 
     templateUrl : "red.html" 
    }) 
    .when("/green", { 
     templateUrl : "green.html" 
    }); 
}); 

red.html

This is red 

green.html

This is green 

Antwort

2

Ja, Index ein Container für andere Ansichten. Sie sollten eine Teilansicht anstelle von Index einfügen. Das Problem ist hier:

$routeProvider 
    .when("/", { 
     templateUrl : "index.html" 
    }) 

Die Template URL wird die komplette index.html innerhalb ng-Ansicht laden, die ein anderen index.html mit einem neuen ng-Blick auf den unendlichen und Secula seculorum geladen werden.

Die einfache Lösung: eine neue Ansicht erstellen (wie die anderen Routen, die Sie haben) und legen Sie sie in der templateUrl

1

Du Looping die App mit dieser Aussage.

$routeProvider 
.when("/", { 
    templateUrl : "index.html" 
}) 

Sie sollten eine andere getrennte Vorlage, die als Haupt-Vorlage steht nicht index.html

Verwandte Themen