Question

我尝试使用ngView显示部分html内容，并使用angularjs进行路由，但是从下面的代码中我不知道为什么我的模板没有显示在主视图中。< / p>

我想导航到localhost \ manageStaff。默认情况下，localhost路由指向Home.cshtml。

以下代码：

 **Home.cshtml**
       @{
      Layout = null;
    }

<!DOCTYPE html>

<html ng-app="myApp">
<head>
<meta name="viewport" content="width=device-width" />
<title>Home</title>
<link href="~/Content/Site.css" rel="stylesheet" />
<link href="~/Content/AdminHeader.css" rel="stylesheet" />
</head>
<body>
<div id="headerArea">
</div>
<div id="sideBar">
    <div id="ActiveMenu">

    </div>
</div>
<div id="mainContent" ng-view>

</div>
<script src="~/Scripts/angular.js"></script>
<script src="~/Scripts/angular-route.min.js"></script>
<script src="~/Scripts/angular-resource.min.js"></script>
<script src="~/js/app.js"></script>

 </body>
 </html>

**app.js**
    angular.module('myApp', ['ngResource','ngRoute'])
      .config(function ($routeProvider, $locationProvider) {
     $routeProvider.when('/manageStaff', {
       templateUrl: 'js/Templates/ManageStaffTemplate.html'
      //controller:'manageStaffCtrl'
      });

     $locationProvider.html5Mode(true);
  })

routeConfig

 public class RouteConfig
 {
    public static void RegisterRoutes(RouteCollection routes)
    {
        routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

        routes.MapRoute(
            name: "Default",
            url: "{controller}/{action}/{id}",
            defaults: new { controller = "Home", action = "Home", id =                                                           
         UrlParameter.Optional }
        );
    }
}

**Main Content Template**
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
Manage Staff
</body>

Answer 1

您的模板不应该是完整的HTML文档，请将Main Content Template更改为：

<div>Manage Staff</div>

嵌套的html / head / body标签无效。

ngview不显示我的模板

1 个答案: