Added code to prevent click event from bubbling since we are navigating to another route. Router state is now initialized with current location to make going back work correctly.

ignite-html-router.js

@@ -86,7 +86,7 @@ IgniteTemplate.prototype.route = function(routes, showCallback = null, hideCallb
 };
 
 /**
- * 
+ * An extension that navigates to a given route when a IgniteTemplate is clicked.
  * @param {String|IgniteProperty|Function} route The route to navigate to. 
  * @param {Any|IgniteProperty|Function} data The data to pass along with this navigate, this only applies when not refreshing, default is null.
  * @param {Boolean|IgniteProperty|Function} refresh Whether or not to refresh the page, default is false.
@@ -94,13 +94,17 @@ IgniteTemplate.prototype.route = function(routes, showCallback = null, hideCallb
  * @returns {IgniteTemplate} This ignite template.
  */
 IgniteTemplate.prototype.navigate = function(route, data = null, refresh = false, keepQuery = false) {
-    return this.onClick(() => {
+    return this.onClick((e) => {
         Router.navigate(
             (route instanceof IgniteProperty ? route.value : (route instanceof Function ? route() : route)),
             (data instanceof IgniteProperty ? data.value : (data instanceof Function ? data() : data)),
             (refresh instanceof IgniteProperty ? refresh.value : (refresh instanceof Function ? refresh() : refresh)),
             (keepQuery instanceof IgniteProperty ? keepQuery.value : (keepQuery instanceof Function ? keepQuery() : keepQuery))
         );
+
+        e.preventDefault();
+        e.stopPropagation();
+        return false;
     });
 }
 
@@ -499,7 +503,7 @@ class Router {
     }
 }
 
-Router.states = [];
+Router.states = [`${window.location.pathname}${window.location.search}${window.location.hash}`];
 Router.hashMode = false;
 
 IgniteHtml.register("router-link", RouterLink);