Question

我有一个索引页面和一个子页面。在我的索引页面中，我试图渲染我的孩子。但不知何故，事情没有按预期工作，Angular路由没有按预期工作

这是我的索引页

@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>Index</h2>

<body ng-app="AngularApp">


    <div> My message {{message1}} </div>

    <a href="FirstChild">First child</a>

    <div></div>



    <div ng-view></div>

</body>

@section scripts{

<script src="~/Scripts/angular.js"></script>
<script src="~/Scripts/angular-route.js"></script>
<script src="~/Scripts/angular-resource.js"></script>
<script src="~/Modules/AngularApp.js"></script>

}

这是我的angularApp.Js文件，我在其中定义了路由

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

myapp.config(function ($routeProvider, $locationProvider) {

    $routeProvider.when('/',
    {
        templateUrl: '/Index',
        controller: 'IndexController'
    })

    .when('/FirstChild',
  {
      templateUrl: '/Angular/FirstChild',
      controller: 'ChildController'
  });

    $locationProvider.html5Mode(true).hashPrefix('!')

});

myapp.controller('IndexController', function ($scope) {
    alert('My Index');
    $scope.message1 = "My Index";
});

myapp.controller('ChildController', function ($scope) {
    alert('My Child Index');
    $scope.FirstMessage = 'My First Message';
});

这是我用于渲染局部视图的ASP.NET MVC Action。我在ASP.NET MVC中的控制器名称是Angular

   public ActionResult FirstChild()
            {
                return PartialView("Firstchild");
            }

问题1：

当我使用Index作为起始页运行应用程序时，这是我在浏览器中看到的URL http://localhost:59367/Angular/Index，但是不会触发Angular端的索引页面中的相应控制器

问题2：

当我单击索引页面中的第一个子链接时，它会将我带到一个完整的页面，而不是在ng-view中呈现局部视图。

http://localhost:59367/Angular/FirstChild

我非常确定Angular路由中存在严重问题，我已经定义但无法弄清楚:(请帮忙

问题摘要： 进一步分析，我发现，一旦我点击“第一个孩子”，理想情况下URL应该像Angular / Index＃/ FirstChild一样，但这里发生的是“ASP.NET MVC Action First Child被调用和URL正在彻底改变“

Answer 1

已发现问题。我所遵循的文章使用了以下部分

 $locationProvider.html5Mode(true).hashPrefix('!')

app.js文件中的

。由于我当地的一些问题，我已将其删除。但是在这样做的时候，我没有更新我的索引页面中的这一部分

<a href="FirstChild">First child</a>

必须是

 <a href="#FirstChild">First child</a>

现在，角度路由开始正常工作，没有任何问题。：）

更新了问题：

我尝试在d代码中包含该行，并在我的href中删除了＃，但它无法正常工作..似乎角度路由也必须更新。

  $locationProvider.html5Mode(true).hashPrefix('!')

有人可以帮助我以正确的格式更新它。

ASP.NET MVC中的角度路由组合

1 个答案: