AngularJS: ngRoute not serving desired home page

2019-03-02 06:42发布

站内问答 / 前沿技术
1821 0 6

I have no idea why my root (home page) isn't routing/displaying correctly.

Here's my ASP.Net Core project file directory setup:

ASP.Net Core Project File Structure

Here's my MapRoute declared in Startup.cs:

app.UseMvc(config =>
{
    config.MapRoute(
        name: "Default",
        template: "{controller}/{action}/{id?}",
        defaults: new { controller = "App", action = "Index" }
    );
});

In my AppController.cs (default controller):

public IActionResult Index()
{
    return View();
}

Here's my Views -> App -> Index.cshtml:

@{ 
    ViewBag.Title = "Home Page";
}
<div>
    <h3>Application Home Page</h3>
</div>

Here's my Views -> Shared -> _Layout.cshtml:

<!DOCTYPE html>
<html ng-app="moveinScheduler">
<head>
    <meta charset="utf-8" />
    <base href="/">
    <title>@ViewBag.Title</title>
    <script src="~/lib/angular/angular.min.js"></script>
    <script src="~/lib/angular-route/angular-route.min.js"></script>
    <script src="~/js/app.js"></script>
    <script src="~/js/loginController.js"></script>
</head>
<body ng-view>
    <div>
        @RenderBody()
    </div>
</body>
</html>

Here's my app.js:

var app = angular.module('moveinScheduler', ['ngRoute'])
    .config(function ($routeProvider, $locationProvider) {

        $routeProvider.when("/", {
            controller: "loginController",
            controllerAs: "vm",
            templateUrl: "index.html"
        });

        $routeProvider.otherwise({
            controller: "loginController",
            controllerAs: "vm",
            templateUrl: "/views/login.html"
        });

    });

Here's index.html located in wwwroot:

<h3>The Home Page</h3>
<p>Home Page paragraph text.</p>

When built/rendered:

Here's the result when I launch in Chrome:

Rendered View

And here's what shows when I view page source:

<!DOCTYPE html>
<html ng-app="moveinScheduler">
<head>
    <meta charset="utf-8" />
    <!-- Rest of the head shown above -->
</head>
<body ng-view>
    <div>
        <div>
    <h3>Application Home Page</h3>
</div>
    </div>
</body>
</html>

Weirdly enough, if I select Inspect Element for the text "Move In Application" on the "home" page, here's what I see:

Inspect element error

It's inserting a title and meta tag inside of the body.

Just to be clear - I was hoping the home page would be exactly what index.html has inside of it.

If anyone has a clue, please help. It'd be great to get the proper content from index.html to show on the Home Page.

0条回答
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(6)