Asp.Net control inside AngularJS views

Question

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)

please provide a sample code

Kiarash
– Kiarash

2013-10-20 23:58:23 +00:00
Commented Oct 20, 2013 at 23:58 — Kiarash
– Kiarash, Commented Oct 20, 2013 at 23:58

Phil Sandler · Accepted Answer · 2013-10-21 01:46:11Z

1

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.

answered Oct 21, 2013 at 1:46

Phil Sandler

28k21 gold badges88 silver badges153 bronze badges

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

1 Comment

christof Over a year ago

Could you give an example? I'm wondering how to include a file uploader for MVC in angular form.

nempoBu4 · Accepted Answer · 2015-02-26 04:45:52Z

0

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");

edited Feb 26, 2015 at 4:45

nempoBu4

6,6619 gold badges38 silver badges42 bronze badges

answered Feb 26, 2015 at 4:04

tapos ghosh

2,20226 silver badges38 bronze badges

Collectives™ on Stack Overflow

Asp.Net control inside AngularJS views

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related