I'm encountering an issue with my directive. The $routeProvider is not getting triggered when the $location changes the URL path.
Here's the code snippet:
var appPath = location.pathname;
var bdaApp = angular.module('bdaApp', ['ui.bootstrap', 'ngResource', 'ngRoute',
'homeController', 'itemController', 'userController',
'eildController']);
bdaApp.config(['$routeProvider', function($routeProvider) {
$routeProvider
.when('/', { templateUrl : 'layout/home', controller : 'HomeListController'})
.when('/item', { templateUrl : 'layout/item', controller : 'ItemListController'})
.when('/user', { templateUrl : 'layout/user', controller : 'UserListController'})
.when('/eild/consultar', { templateUrl : 'eild/layout', controller : 'EildListController'})
.when('/eild/detalhes/:bilhetePedido', {templateUrl : 'eild/detalhes', controller : 'EildDetailController'});
}]);
bdaApp.directive('myDirective', ['$location', function($location) {
return {
restrict: 'A',
template:
'<ul class="nav navbar-nav">' +
' <li ng-repeat="p in parents" class="dropdown">' +
' <a ng-click="go(p.path)" class="dropdown-toggle">' +
' {{p.nome}}' +
' <b ng-show="p.menus.length > 0" class="caret"></b>' +
' </a>' +
' <ul ng-show="p.menus.length > 0" class="dropdown-menu">' +
' <li ng-repeat="s in p.menus">' +
' <a ng-click="go(s.path)">{{s.nome}}</a>' +
' </li>' +
' </ul>' +
' </li>' +
'</ul>',
controller: ['$scope', '$resource', function($scope, $resource) {
$scope.getItems = function() {
$resource(appPath + 'menus/teste').query(function(data) {
$scope.parents = data;
});
};
}],
link: function(scope, iElement, iAttrs) {
scope.getItems();
scope.$watch('parents', function(newVal) {});
scope.go = function(path) {
if (path != null) {
$location.path(path);
}
};
scope.$watch('go', function(newVal) {});
}
};
}]);
and here's my HTML:
<div>
<div my-directive items="items"></div>
</div>
Whenever I click on a link, the "go" function gets called and changes the URL to "
http://localhost:8080/bda-web/#/itemI also attempted to move my function externally like so:
bdaApp.controller('MenuController', ['$scope', '$location', function($scope, $location) {
$scope.go = function(path) {
if (path != null) {
alert(path);
$location.path(path);
}
};
}]);
However, I was unable to make this work.
Any suggestions would be greatly appreciated!
Thank you