Question

我有以下指令，这是一个按钮，在单击按钮时尝试更改路径，但没有任何反应。

app.directive('searchAgainButton', function ($location) {
    return {
        template: '<button class="searchAgainButton"><i class="fa fa-search" aria-hidden="true"></i><span> Search Again</span></button>',
        link: function (scop, element, attrs) {
            element.on('click', function () {
                 $location.path('/index')
            })
         }
     }
});

Answer 1

element未指向该按钮。试试这个

    var app = angular.module('myApp', []);

    app.directive('searchAgainButton', function ($location) {
        return {
                restrict:"AE",
            template: '<button ng-click="changePath()" class="searchAgainButton"><i class="fa fa-search" aria-hidden="true"></i><span> Search Again</span></button>',
            link: function (scope, element, attrs) {
                scope.changePath = function(){
                     $location.path('/index')
                }
             }
         }
    });

//html
<div ng-app="myApp">
  <div search-again-button></div>
</div>

FIDDLE EXAMPLE

如何更改自定义指令的路径？角

1 个答案: