Question

我有一个复杂的MVC项目，我们正在添加一些Angular功能。我是Angular的新手，现在正在观看关于Pluralsight的三个Angular课程。他们非常乐于助人，但我缺少一些理解。

据我所知，我只需要一个ng-app（除非我想引导而且我不认为我想要）。所以这个应用程序定义了我的配置和自定义指令。自定义指令工作得很好，但当我点击该指令中的链接时，它不会去任何地方....好吧它可能会，但不是我期待的地方。 Fiddler没有像404或500错误那样出现异常。

(function ()
{
  "use-strict";


   angular.module("appMainNav", ["ngRoute"])
   .config(function ($routeProvider) {

    $routeProvider.when("/MySearch", {
        controller: "routingController"
    });

    $routeProvider.otherwise({ redirectTo: "/" });

})

})();

我的routingController：

(function () {

  "use strict";

  angular.module("appMainNav")
  .controller("routingController", routingController);

function routingController($http) {

    var vm = this;

    alert("Routed");
}
})();

我呈现的HTML链接：

<a href="#/MySearch">Search</a>

我没有找到找不到的页面...网址只是附加了＃/ MySearch。没有控制台错误等。

我期待得到一个javascript警报......？

TIA

修改

应该早点加入。这是标记：

_Layout page：

<body>
   <div ng-app="appMainNav" ng-controller="routingController" class="container">
      @RenderBody()
    </div>
</body>

RenderBody是Index.cshtml：

<div class="row">
<div>
    Header Stuff
</div>
</div>

<div class="row">

<div class="col-md-2">
    <dashboard-main-nav></dashboard-main-nav>
</div>

<div  class="col-md-3">
    <div></div>
</div>

<div class="col-md-8">
    <div></div>
</div>

</div>

<div class="row">
<div>
    Footer Stuff
</div>
</div>

自定义指令角度代码不在上面的剪辑之外，而是生成链接的位置。

Answer 1

您需要为锚标记上的click事件分配一个事件处理程序：

<a href="#/MySearch" ng-click="foo()">Search</a>

其中foo是在控制器范围内定义的函数：

function routingController($http, $scope) {

    var vm = this;
    $scope.foo = function(){
      alert("I am so tired");
    }

    alert("Routed");
}

尝试一下，它应该有用。

角度路由/ MVC区域的超链接无法正常工作

1 个答案: