Question

所以我设置了一个使用Angular Routing的网站，但我的行为非常奇怪。当我访问路径时，它似乎无限期地在控制器中运行代码，直到选项卡崩溃。这是我的路线：

angular.module(app.appName)
    .config([
        '$routeProvider', function($routeProvider) {
            $routeProvider
                .when('/', {
                    controller: 'homeController',
                    caseInsensitiveMatch: true
                })
                .when('/MyWishlists', {
                    templateUrl: 'assets/html/areas/MyWishlists/myWishlists.html',
                    controller: 'myWishlistsController',
                    caseInsensitiveMatch: true
                })
                .when('/Login', {
                    templateUrl: 'assets/html/areas/login/login.html',
                    controller: 'loginController',
                    caseInsensitiveMatch: true
                })
                .otherwise({ redirectTo: '/' });
        }
    ]);

这是我的loginController：

angular.module(app.appName)
    .controller('loginController', ['$scope',
        function ($scope) {
            console.log('login');
        }]);

当我访问http://localhost:50925/Login时，它会一遍又一遍地运行console.log('login');，直到Chrome结束它。我在这是要干嘛导致这种情况的原因，我以前从未见过它？

可能与我的连接文件有关吗？我使用gulp将所有控制器合并到controllers.js。

修改：我刚刚尝试创建一个新的控制器homeController并将其添加到我的路线中，并且它在＆＃39的任何一条路线上根本不使用homeController ; s定义。

angular.module(app.appName)
    .config([
        '$routeProvider', function($routeProvider) {
            $routeProvider
                .when('/', {
                    controller: 'homeController',
                    caseInsensitiveMatch: true
                })
                .when('/Home', {
                    controller: 'homeController',
                    caseInsensitiveMatch: true
                })
                .when('/MyWishlists', {
                    templateUrl: 'assets/html/areas/MyWishlists/myWishlists.html',
                    controller: 'myWishlistsController',
                    caseInsensitiveMatch: true
                })
                .when('/Login', {
                    templateUrl: 'assets/html/areas/login/login.html',
                    controller: 'loginController',
                    caseInsensitiveMatch: true
                })
                .otherwise({ redirectTo: '/' });
        }
    ]);

angular.module('wishlist')
    .controller('homeController', ['$scope',
        function ($scope) {
            console.log('home');
        }]);

Answer 1

您应该在定义角度模块时注入ngRoute。这是Link，它将帮助您定义ngRoute并希望它能为您提供帮助。

Answer 2

看起来控制器doest中的函数有一个名称，并且存在一些错误。你可以检查一下。你需要添加这样的东西。

angular.module('myApp',['ngRoute']);

Angularjs需要注入您想要使用的模块。使用前需要注入所有依赖项。

其他一切看起来都不错。

Answer 3

我已经解决了这个问题。对我来说问题是我正在使用ASP.NET，但我正在使用一种完全绕过MVC管道的方法。为此，我需要创建一个Index.cshtml并告诉应用程序提供该文件。但是，此时，它会将web.config重写规则中未特别列出的所有文件作为HTML返回给浏览器。我已经允许我的assets / js文件夹，但不是我的HTML，因此它不是使用Angular提供HTML模板，而是检索整个重新编译的页面作为对浏览器的响应，这反过来又为浏览器提供了一个完整的HTML页面为了呈现新的路线，它一直反复执行，直到浏览器最终结束它。

简而言之，要解决这个问题，我必须将它添加到我的web.config中的规则中。

<rewrite>
  <rules>
    <rule name="AngularJS Conditions" stopProcessing="true">
      <match url="(wwwroot/.*|assets/min.*|assets/html.*|bower_components/.*|api/.*)" />
      <conditions logicalGrouping="MatchAll" trackAllCaptures="false" />
      <action type="None" />
    </rule>
    <rule name="AngularJS Wildcard" enabled="true">
      <match url="(.*)" />
      <conditions logicalGrouping="MatchAll" trackAllCaptures="false" />
      <action type="Rewrite" url="index.cshtml" />
    </rule>
  </rules>
</rewrite>

AngularJs Controller代码无限期运行

3 个答案: