AngularJS路由行为与预期不同，没有任何错误

AngularJS routing behavior not as expected, no errors whatsoever

本文关键字：错误 任何 路由 AngularJS      更新时间：2023-09-26

SO、的编码员

我的代码似乎遇到了一个打击性的问题，我对angularJS相对陌生，所以这可能是我的一个错误，但我似乎无法解决。

用例如下，我有一个简单的django rest_framework应用程序，它可以100%工作(使用swagger UI进行测试(。我确信Django应用程序中没有任何问题。我希望使用angularJS来控制前端。

出于某种奇怪的原因，我无法理解angularJS中的路由拒绝完成它的工作。

这是我的app.routes.js

(function () {
  'use strict';

  angular
    .module('inventaris.routes')
    .config(config);
  config.$inject = ['$routeProvider'];
  function config($routeProvider) {
    $routeProvider.when('/register', {
        controller: 'RegisterController',
        controllerAs: 'vm',
        templateUrl: '/static/templates/authentication/register.html'
    }).otherwise('/');
  }
})();

下面的代码块是我的app.js

(function () {  
  'use strict';   
  angular   
     .module('inventaris', [    
        'inventaris.routes',    
        'inventaris.config',    
        'inventaris.authentication'
     ]);
    angular
        .module('inventaris.routes', ['ngRoute']);
    angular
        .module('inventaris.config', []);
    angular
       .module('inventaris')
       .run(run);
    run.$inject = ['$http'];
    function run($http) {
        $http.defaults.xsrfHeaderName = 'X-CSRFToken';
        $http.defaults.xsrfCookieName = 'csrftoken';
    }
})();

下图是chrome浏览器的屏幕截图，调试器打开，您可以看到没有错误

所以我缺乏发布图片所需的10个声誉，这里有一个直接链接到图片-https://i.stack.imgur.com/GVZAB.jpg

我在这里不知所措，我已经检查了多次代码，也许我忘记了一个；或者，在某个地方，但据我所知，我没有错过任何一个。控制台对我的帮助也不大。

预期行为：遵循预定义的路线并根据路线加载模板。

当前行为：不遵循任何路线，django的控制台显示页面加载了状态200，但没有显示任何内容。

这就是为什么我转向你，那么，有什么原因可能是棱角分明的路线拒绝了做它的工作？

如果需要更多信息，我很乐意提交信息。

编辑javascripts.html 中文件的顺序

<script type="text/javascript" src="{% static 'bower_components/bootstrap/dist/js/bootstrap.js' %}"></script>
<script type="text/javascript" src="{% static 'bower_components/bootstrap-material-design/dist/js/material.js' %}"></script>
<script type="text/javascript" src="{% static 'bower_components/bootstrap-material-design/dist/js/ripples.js' %}"></script>
<script type="text/javascript" src="{% static 'bower_components/underscore/underscore.js' %}"></script>
<script type="text/javascript" src="{% static 'bower_components/angular/angular.js' %}"></script>
<script type="text/javascript" src="{% static 'bower_components/angular-route/angular-route.js' %}"></script>
<script type="text/javascript" src="{% static 'bower_components/angular-cookies/angular-cookies.js' %}"></script>
<script type="text/javascript" src="{% static 'bower_components/ngDialog/js/ngDialog.js' %}"></script>
<script type="text/javascript" src="{% static 'lib/snackbarjs/snackbar.min.js' %}"></script>
<script type="text/javascript" src="{% static 'js/inventaris.js' %}"></script>
<script type="text/javascript" src="{% static 'js/inventaris.config.js' %}"></script>
<script type="text/javascript" src="{% static 'js/inventaris.routes.js' %}"></script>
<script type="text/javascript" src="{% static 'js/authentication/authentication.module.js' %}"></script>
<script type="text/javascript" src="{% static 'js/authentication/services/authentication.service.js' %}"></script>
<script type="text/javascript" src="{% static 'js/authentication/controllers/register.controller.js' %}"></script>

.otherwise({
    redirectTo : '/'
})

试试这个，它可能是工作

相关文章：