Angularjs 路由导致超过最大调用堆栈大小_Angularjs

Angularjs 路由导致超过最大调用堆栈大小

angularjs

Angularjs 路由导致超过最大调用堆栈大小,angularjs,Angularjs,我对angularJS是新手。我试着去尝试和实践一些例子，但遇到了一个非常棘手的错误。我花了几个小时来找出这个错误，但我没能克服它。有人能帮我摆脱这个陷阱吗在app.js中 var sampleApp = angular.module('phonecatApp', ['ngRoute']); sampleApp .config(['$routeProvider','$locationProvider', function($routeProvider,$locationProvider)

我对angularJS是新手。我试着去尝试和实践一些例子，但遇到了一个非常棘手的错误。我花了几个小时来找出这个错误，但我没能克服它。有人能帮我摆脱这个陷阱吗

在app.js中

var sampleApp = angular.module('phonecatApp', ['ngRoute']);

sampleApp .config(['$routeProvider','$locationProvider',
  function($routeProvider,$locationProvider)
  {
    $routeProvider.
      when('/', {
        templateUrl: 'index.html',
      }).
      when('/addOrder', {
        templateUrl: 'add-order.html',
        controller: 'AddOrderController'
      }).
      when('/showOrders', {
        templateUrl: 'show-orders.html',
        controller: 'ShowOrdersController'
      }).
      otherwise({
        redirectTo: '/addOrder'
      });
      $locationProvider.html5Mode({
        enabled: true,
        requireBase: false
        });
  }]);

sampleApp.controller('AddOrderController', function($scope) {

  $scope.message = 'This is Add new order screen';

});


sampleApp.controller('ShowOrdersController', function($scope) {

  $scope.message = 'This is Show orders screen';

});

在index.html中

<!DOCTYPE html>
<head>
</head>
    <h1>weclome to test!</h1>
<body ng-app="phonecatApp" >
<div ng-view></div>

<script src="//code.angularjs.org/1.2.20/angular.js"></script>
<script src="//code.angularjs.org/1.2.20/angular-route.js"></script>
<script src="static/app.js"></script>   
</body>


</html>


我们需要测试！

在add_order.html中

<h2>Add New Order</h2>

{{ message }}

<h2>Show Orders</h2>

{{ message }}

添加新订单
{{message}}

在show_order.html中

<h2>Add New Order</h2>

{{ message }}

<h2>Show Orders</h2>

{{ message }}

显示订单
{{message}}

此外，存储js和html文件的文件夹的错误源目录会导致该错误吗

这是chrome控制台中显示的错误

我想您正在浏览到/，可能是index.html，其中包括app.js，由于路线原因需要index.html，需要app.js等等。。。您可能需要将/template放在另一个html文件中（我们称之为home.html），然后将/home.html的模板更改为home.html。然后我试着把“脚本”标签放到“头”标签上。现在很好用

<!DOCTYPE html>
<html>
<head>
    <script src="//code.angularjs.org/1.2.20/angular.js"></script>
    <script src="//code.angularjs.org/1.2.20/angular-route.js"></script>
    <script src="static/app.js"></script>
</head>
<body ng-app="phonecatApp" >
    <h1>weclome to test!</h1>
    <div ng-view></div>  
</body>

</html>


我们需要测试！

将路由脚本拆分到不同的文件中

angular.module（'phonecatApp'）.config（['$routeProvider'，'$locationProvider'，'，
函数（$routeProvider，$locationProvider）
{
$routeProvider。
当（“/”{
templateUrl:'index.html'，
}).
当（“/addOrder”{
templateUrl:'addorder.html'，
控制器：“AddOrderController”
}).
当（“/showOrders”{
templateUrl:“show orders.html”，
控制器：“ShowOrdersController”
}).
否则({
重定向到：'/addOrder'
});
$locationProvider.html5模式({
启用：对，
requireBase:错误
});
}]);我也面临类似的问题/错误。对我起作用的是我使用了#的路线。i、 EI从app.js

$locationProvider.html5Mode({
          enabled: true,
          requireBase: false
});

你能发布完整的错误消息吗？@SteamDev我添加了一个错误截图。我不能停止程序，除非杀死它。你在递归调用某个函数。在您发布更多代码之前，我们无法确定问题所在。对您来说，最简单的事情就是开始剥离部分，直到您有了一个可复制的测试用例。在做这个练习时，您可能会遇到递归。@Adam我使用Django作为后端服务器。index.html由Django模板呈现。它可能是可疑目标吗？抱歉，在更正对索引文件的路由器引用时错误地发布了整个代码：P