Question

您好我的角应用程序，我使用routeProvider路由部分，在一个页面中，我有一组链接，我使用ng-href提供链接。我有一个链接的ng-click事件。但是当我点击链接时，页面会转到routeProvider的otherWise部分并加载我在那里定义的页面。

查看代码

HTML

           <li ng-repeat="item in supplyItem">
                <a class="span" ng-click="showDetails()" ng-href="#{{item.header}}">
                    {{item.header}}
                </a>
            </li>

App.js

var myApp = angular.module("myApp",[
    'ngRoute',
    'appController'
    ]);

myApp.config(['$routeProvider',function($routeProvider){
$routeProvider.
    when('/home',{
        templateUrl : 'partials/home_page.aspx',
        controller:'HomePageController',
    }).
    when('/supplies',{
        templateUrl : 'partials/supplies.aspx',
        controller:'SupplyController',
    }).
    otherwise({
        redirectTo: '/home'
    });


}]);

controller.js

appController.controller('SupplyController', ['$scope', function ($scope) {
    $scope.firstITem = "Acrylics";
    $scope.showDetails = function() {
        alert("clicked");

    }


 $scope.supplyItem = [
    {
        "header": "Acrylics",
        "Acrylics": [
                "Custom Tray Material",
                "Reline Materials",
                "Reline Materials-Hard",
                "Reline Materials-Soft",
                "Repair Acrylics",
                "Resin & Pattern Materials",
                "Temporary Crown and Bridge Material",
                "Tissue Conditioner",
                ]
    }
];


} ]);

错误是什么？我怎么解决这个

Answer 1

你的控制器应该包含你的函数作为$scope的字段，所以它看起来像这样：

$scope.firstITem = "Acrylics";
$scope.showDetails = function(e) {
    e.preventDefault();
    alert("clicked");
}

此外，我认为您不应该使用ng-href，因为点击会覆盖您的href

Answer 2

$scope.showDetails = function() {
    enter code here
}

如果您希望在点击事件后激活链接，请

松开ng-href。

<li ng-repeat="item in supplyItem">
    <a class="span" ng-click="showDetails(item)">
        {{item.header}}
    </a>
</li>

$scope.showDetails = function(item) {

    alert();
    window.location.href = "#' + item.header;
}

ng-click事件不适用于角度js中的链接

2 个答案: