CODEWITHSUNDEEP
asp.netangularjs
Duncan Matheson
Duncan Matheson

Reputation: 1726

Asp.Net control inside AngularJS views

I've got AngularJS application that is loosely wrapped by an Asp.Net MVC page. The AngularJS stuff ignores the Asp.Net and does its own routing, ng-includes, and so on, so pages are constructed from html partials that Asp.Net knows nothing about.

I've run into a situation where it would be very useful to have an Asp.Net control / MVC extension in one of my pages, but the pages are deep in Angular land. Is there any practical way of getting this working without restructuring the whole application?

This is sort of what I'm trying to accomplish:

index.cshtml:

<body ng-app="App" ng-controller="Controller">
    <div ng-include src="angularView.html">

angularView.html:

<div ng-include src="aspNetView.cshtml">

aspNetView.cshtml:

@Html.Something()

Obviously the ng-include aspNetView.cshtml won't work, but this is what I'm trying to do: Asp.Net stuff inside the Angular stuff.

(My specific use case is trying to put in a DevExpress grid using @Html.DevExpress().GridView(...), but the problem is still general)

Upvotes: 2

Views: 1341

Answers (2)

tapos ghosh
tapos ghosh

Reputation: 2202

To call partial view in asp.net mvc5 using AngularJS write this way:

<ng-include src="'@Url.Action("method_name", "Controller_name")'"></ng-include>

And also remember your controller method must return this way:

return PartialView("~/Views/Angular/TableAdd.cshtml");

Upvotes: 0

Phil Sandler
Phil Sandler

Reputation: 28036

You could return a partial view from an ASP.Net MVC controller, and then call the method from angular and render the returned HTML in a div or other container.

If this is just displaying data, it should work with little problem (it's just an ajax call like any other). If the rendered HTML has to interact with the rest of the page (e.g. angular $scope, etc.) it might be more complicated.

Upvotes: 1

Related Questions