Reputation: 394
I am trying to use $location.url or path to update a view in ng-view, but unsuccessfully. The controller is:
eventsApp.controller('MenuController',
function($scope, $location) {
$scope.createEvent = function(){
$location.url('/newEvent');
};
}
);
The function is simply called in a ngClick event located within the controller:
<li><a href="#" ng-click="createEvent()">Create Event</a></li>
And the routing is:
angular.module('eventsApp', ['ngResource', 'ngRoute'])
.config(function($routeProvider) {
$routeProvider.when('/newEvent',
{
templateUrl:'templates/NewEvent.html',
controller: 'EditEventController'
});
});
Of course, if i use the href of the anchor tag, it works fine; but if I want to do something more complex in the called function, I can't.
I looked in the Network section of the browser tools and I could see that the template has been fetched. But the neither the url in the address bar is updated, or the view is updated (it actually becomes blank). I am using Apache as a web server, if this thing could be useful in understanding the cause of this issue.
Upvotes: 0
Views: 84
Reputation: 2881
I suspect it is reloading the page due to the href="#"
. If you need to stick with an anchor tag even though you're not using href, try removing the #
like so:
<li><a href="" ng-click="createEvent()">Create Event</a></li>
However, there could be some fallback if you need to support IE users. If that is the case, you could switch out the anchor tag for a button.
<li>
<button type="button" ng-click="createEvent()">Create Event</button>
</li>
Upvotes: 1