<!DOCTYPE html>
<html ng-app="app">

  <head>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <script data-require="jquery@*" data-semver="3.0.0" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.js"></script>
    <script data-require="angularjs@1.5.8" data-semver="1.5.8" src="https://opensource.keycdn.com/angularjs/1.5.8/angular.min.js"></script>
    <script data-require="ngRoute@*" data-semver="1.3.15" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-route.js"></script>
    <script src="script.js"></script>
  </head>

  <body>
    <div ng-view>
      <p>Loading, please wait...</p>
    </div>
  </body>

</html>
// Code goes here

(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) {
        // Normally in a directive, the library I'm working with won't
        // work, so I stuffed it into a service.
        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);
/* Styles go here */

<div>
  <h1>Hi!</h1>  
  <p>You're in the list view.</p>
  <button id="jqueryBtn">Click to Reproduce</button>
</div>
<div>
  <p>Now in editor mode.</p>
</div>