Question: How to render sections in using razor MVC view

Question

How to render sections in using razor MVC view

Answers 0
Added at 2017-11-30 23:11
Tags
Question

I have a basic web site which is mixing cshtml content (note this is not an MVC site just a website serving up cshtml files) and angularJs. Default.cshtml is in the root of the site which references the _SiteLayout.cshtml file enter image description here

_SiteLayout contains the following html and razor syntax

<!DOCTYPE html>
<html lang="en" ng-app="app">
    <head>
        <meta charset="utf-8" />
        <title>@Page.Title</title>
     @RenderSection("Styles", false)
        <meta name="viewport" content="width=device-width" />
    </head>
    <body>

    <div ng-view>

        @RenderBody()
    </div>

    <script src="~/Scripts/angular.js"></script>
    <script src="~/Scripts/ng-route.js"></script>
    <script src="~/App/app.js"></script>
    <script src="~/App/controllers/index.js"></script>
    <script src="~/App/controllers/master.js"></script>

    @RenderSection("Scripts", required: false)
    </body>
</html>

Within the App/views directory of my angular app I have an index.cshtml and master.cshtml pages.

the master.cshtml file contains a reference to the section styles (that is defined in the layout page)

@section Styles{
   <link href="~/Content/bootstrap.css" rel="stylesheet" />
   <link href="~/Content/bootstrap-theme.css" rel="stylesheet" />
}
<p>master page</p>
@DateTime.Now.ToShortDateString()

I added the @DateTime syntax just to make sure razor was working which it is. The issue I am seeing is the @section style is not recognized or cannot be resolved. I am seeing an intellisense error VS but the site will compile and render. Both cshtml files have been added to the site as razor views (not partials). I have tested this same binding with a view being stored in root of the site and received the same result of no files being loaded.

The application is using ngRoute / angular for navigation there is no MVC controllers or route.config setup in this application. The angular routes look like this:

var app = angular.module('app', ['ngRoute']);

    app.config(['$routeProvider', '$locationProvider', ($routeProvider, $locationProvider) => {

        console.log('loading angular app...');
        $routeProvider
            .when('/',
            {
                templateUrl: '/app/views/index.cshtml',
                controller: 'indexCtrl',
                controllerAs: 'idx'
            }).when('/master',
            {
                templateUrl: '/app/views/master.cshtml',
                controller: 'masterCtrl',
                controllerAs: 'mn'
            });

        $locationProvider.html5Mode({
            enabled: true,
            requireBase: false
        });
    }]);

This application is a legacy application and I don't have the luxury to use ui-route so I have to use ngRoute v.1.2.18

Can anyone provide some insight as to why the section is not being recognized.

Answers to

How to render sections in using razor MVC view

Source Show
◀ Wstecz