更改根事件

Question

我不知道为什么，但是当我从JQuery捕获事件时，更新路线并通知Angular变化，它进入无限路径。它很容易重现，比如你有这样的屏幕：

点击按钮由jQuery处理，因为jquery库似乎不能在指令中工作，所以我把它放在一个服务中。一旦控制器加载我初始化它。然后，当用户单击该按钮时，我会捕获此jquery事件，并在根范围上引发一个新事件，以便我知道导航到新视图。这是代码：

(function(angular, $) {
  var app = angular.module('app', ['ngRoute']);

  app.config(['$locationProvider', '$routeProvider',
    function config($locationProvider, $routeProvider) {
        $routeProvider.when('/', {
            templateUrl: 'list.html',
            controller: 'ListController' 
        });

        // The view I am trying to reach via jquery event.
        $routeProvider.when('/Edit', {
            templateUrl: 'edit.html',
            controller: 'ListController' 
        });

        $locationProvider.html5Mode(true); 
    }]);

    app.controller('ListController', 
      function ListController($scope, $rootScope, $location, JQuerySerivce) {
        // Initialize the button click listener.
        JQuerySerivce.registerBtn();

        $rootScope.$on('clicked', function() {
          $location.path("./Edit"); 
          // Notify angular stuff happened.
          $scope.$apply();
        });
    });

    app.controller('EditController', function EditController() {
      console.log("Edit view loaded!");
    });

    app.factory("JQuerySerivce", function ($rootScope){
      return {
        registerBtn: function() {
          $('#jqueryBtn').on('click', function() {
            $rootScope.$broadcast('clicked');
          });
        }
      };
    });

})(angular, jQuery);

工作的plunker示例：

https://embed.plnkr.co/WIwRreYtofGKQWdjTeQx/

[编辑]

为了澄清我的问题，我该如何防止这种无限循环的发生？我发现的关于路由和无限循环的所有其他问题通常都是引入循环的某种错误。在这种情况下，我只是导航，框架正在消亡。也许我的做法是错的？如果有人有替代方案，我愿意改变它。我无法逃脱jquery事件：/任何帮助都会非常感激。

Answer 1

$location.path("/Edit");

而不是

$location.path("./Edit");