Issue using the Angularjs $location provider and ASP.NET MVC action links together

Question

I have an application that uses both ASP.NET MVC and Angularjs. I'm using the Angularjs $location provider to modify the search part of the url when filters are added or removed.

$location.search(searchObj);

I am then subscribing to the $locationChangeSuccess event and using signalr to update the data on the page without requiring an asp.net post each time a filter is changed.

$scope.$on('$locationChangeSuccess', onRouteChanged, false);

All of the above works, however, I also have some mvc action links on the page that I need to work when clicked.

<a href="@(Url.Action("Details", "Video"))/{{item.id}}">
...
</a>

Unfortunately, when clicking those links, the url is updated but the mvc post doesn't happen. If anyone knows how to make this work I would be grateful.

zs2020 · Accepted Answer · 2013-09-09 03:52:14Z

2

By default, the link in directive a is handled by AngularJS's route module. If you want to make a API request, you can make the call using $http module either wrapped in a service or factory or just in the controller.

Try this:

<a href="" ng-click="showVideo(@(Url.Action("Details", "Video"))/{{item.id}})">

$scope.showVideo = function (url) {
    $http.get { method: 'GET', url: url }).
    success(function (data, status, headers, config) {
        // this callback will be called asynchronously
        // when the response is available
    }).
    error(function (data, status, headers, config) {
        // called asynchronously if an error occurs
        // or server returns response with an error status.
    });
}

answered Sep 9, 2013 at 3:52

zs2020

54.7k30 gold badges157 silver badges223 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Nicholas J. Markkula Over a year ago

Well you got me on the right track. I actually had to set the document.location using document.location.replace(url) instead of using the $http provider to make the mvc post happen. Thanks much for your answer.

Collectives™ on Stack Overflow

Issue using the Angularjs $location provider and ASP.NET MVC action links together

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related