Within my angularjs application, I opted to switch from using ngRoute (routeProvider) to ui.router (urlRouterProvider) module and stateProvider for transitioning between different states in the app.
However, I recently discovered that ui-router only supports states and <a ui-sref=""> instead of <a href="">. Since I need to handle application navigation externally with JavaScript, I am unable to change the anchor tags from href to sref. Below is how I have set up the navigation links:
Portal.setNavigation(
[
{
"label": "Application1",
"selected": true,
"url": "/web/guest#/Application1"
}
]
);
This code assigns the proper href attributes. Here is a snippet of my stateProvider, which functions with manually placed srefs like this one:
<a ui-sref="Application1">Application State 1</a>app.config(['$stateProvider', '$urlRouterProvider',
function($stateProvider, $urlRouterProvider) {
$stateProvider
.state('Application1', {
url: '/Application1',
templateUrl: '/Application.html',
controller: 'AppCtrl'
});
}]);
Do you have any suggestions on how I can continue utilizing ui-router while still being able to use hrefs for navigating through states?