ngRoute Endlosschleife beim Ändern des Pfades auf einem Root-Ereignis

Question

Ich bin mir nicht sicher warum, aber wenn ich ein Ereignis von JQuery abfangen, die Route aktualisieren und Angular der Änderung benachrichtigen, geht es in eine unendliche Route. Es ist leicht zu reproduzieren, zu sagen, dass Sie einen Bildschirm wie dieses:

Der Klick auf den Button von jQuery behandelt wird, weil die jQuery-Bibliothek nicht in einer Richtlinie scheint zu arbeiten, damit ich es in Ein Dienst. Sobald der Controller geladen ist, initialisiere ich dies. Wenn der Benutzer dann auf diese Schaltfläche klickt, erfasse ich dieses jquery -Ereignis und hebe ein neues Ereignis im root-Bereich an, sodass ich weiß, dass ich zur neuen Ansicht navigieren muss. Hier ist der Code:

(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); 

Die Arbeits Plunker Beispiel:

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

[EDIT]

Auf meine Frage zu klären, wie kann ich diese Endlosschleife verhindern? Alle anderen Fragen, die ich bezüglich Routing und Endlosschleifen habe, waren normalerweise eine Art Fehler, der eine Schleife einführt. In diesem Fall navigiere ich nur und der Rahmen stirbt. Vielleicht ist mein Ansatz falsch? Ich bin offen dafür, es zu ändern, wenn jemand eine Alternative hat. Ich kann dem jquery-Ereignis jedoch nicht entkommen:/Jede Hilfe würde sehr geschätzt werden.

Answer 1

$location.path("/Edit");

statt

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

?