AngularJS without SPA and using ASP.NET MVC routing

Question

I want to use AngularJS non-SPA for my website along with ASP.NET MVC. The authentication happens through Active Directory so I find it best to use ASP.NET MVC for routing and authentication/authorization.

So what I would like to do is to create a _Layout.cshtml page that contains a ng-app definition, then each view derived from _Layout.cshtml would contain a ng-controller definition.

For RESTful data handling I would use a ASP.NET Web API.

The only problem I can think of are the URL query string parameters. If I would like to view some record specific by ID, I would always have to put the ID in a ViewBag in the ASP.NET MVC controller and obtain it in the view like this:

<script>
    var roomID = @ViewBag.roomID
</script>

Is there some better way to do this? Please shed some light. :)

Answer 1

Updated Answer:

Since you are not using Angularjs routing, you can use ngInit. It will initialize a new variable in your controller's scope and you will be able to access it like:

HTML (inside your controller):

<AnyElement ng-init="roomID = @ViewBag.roomID"></AnyElement>

JavaScript:

var roomID = $scope.roomID;

For more explanations see ngInit documentation.

Original Answer:

In Angularjs you can access the query string parameter very easily like:

var paramValue = $routeParams.yourParameterName;

Or if you want to initialize a JavaScript variable then consider using ngInit. It will initialize a new variable in your controller's scope and you will be able to access it like:

HTML (inside your controller):

<AnyElement ng-init="roomID = @ViewBag.roomID"></AnyElement>

JavaScript:

var roomID = $scope.roomID;

For more explanations see ngInit documentation.

Hope that helps.