如何避免在jquery中两次单击按钮触发事件

当我单击一次按钮时，我无法触发事件。双击按钮将触发我的事件

我在这里使用了angular js和jQuery。我不知道我哪里出了问题。有人能帮我解决这个问题吗

我的js代码：

   var app = angular
            .module('Home', [ 'ngAnimate', 'ui.bootstrap', 'ngRoute' ]);
    app.config([ '$routeProvider', function($routeProvider) {
        $routeProvider.when('/basic', {
            controller : 'Sample',
            templateUrl : 'html/basic.html'
        }).when('/features', {
            controller : 'Sample',
            templateUrl : 'html/basic.html'
        })
    } ]);
    app.controller('Sample', function($scope) {

        $scope.getFilenameFromPath = function(filename) {
                return filename.split("/")[1].split(".")[0];
        }

            $('#hideDiv').click(function() {
                    $('#diva').hide();
            })

    });

我的html代码：

<a  href="#/basic"><button id="hideDiv" style="margin-left: 22px; background-color: #73AD21">Basic</button></a>

<a href="#/features"><button id="showDiv" style="margin-left: 22px; background-color: #73AD21">+Features</button></a>



    <div id="diva" class="subdiv">
     <div style="margin-top: 15px; display: inline-block"
                ng-repeat="advanceimage in advanceimages">
      <img width=40 height=50 style="margin-left: 12px;" ng-src="{{advanceimage}}" /> 
      <br>
      <span style="margin-left: 12px;">{{getFilenameFromPath(advanceimage)}}</span>
     </div>
    </div>

{{getFilenameFromPath（advanceimage）}

以下是如何使用

ngHide

的示例：

var-app=angular.module（'app'，[]）；
应用程序控制器（'MainCtrl'，函数（$scope）{
$scope.hideDiva=false；
$scope.toggle=函数（）{
$scope.hideDiva=！$scope.hideDiva；
};
});

隐藏/显示
试着调查
去抖
或
油门
技术-或

Throttle-创建并返回传递函数的新的限制版本，该版本在重复调用时，每等待毫秒最多只调用一次原始函数。用于限制发生速度快于您所能跟上的事件的速率

为什么不使用or？事实上，我试过使用ng hide和ng show。但是，我做不到。我在这里使用相同的控制器和相同的html页面。当我单击“基本”按钮时，我应该隐藏“diva”，单击“功能”按钮时，两个按钮都应该显示“diva”，我只能隐藏div（或）显示div