Question

我的导航栏有一个简单的列表，我使用ng-click和ng-blur来更改列表中的选定选项。不幸的是，它需要双击才能更改，我无法解释原因。

JS：

angular.module("myApp", [])
.controller("navCtrl", function(){

});

HTML：

<body ng-app="myApp">
  <div class="navbar" ng-controller="navCtrl">
   <ul>
     <div ng-repeat="e in ['about', 'offers', 'requests']"  ng-init="selected = false" class="{{e}}">
       <a href="#{{e}}" ng-blur="selected=false" ng-click="selected = !selected">
       <li ng-class="{'selected': selected}">{{selected}}</li>
      </a>
    </div>
   </ul>
 </div>
</body>

Answer 1

我发现解决方案是我自己的，还有其他div，我在导航栏的href中引用，它与列表中元素的类具有相同的ID。我注意到，如果我从div中删除ID，则ng-click工作正常。谢谢你的时间。

HTML：

<ul>
 <div ng-repeat="e in ['about', 'offers', 'requests']"  ng-init="selected = false">
   <a href="" ng-blur="selected=false" ng-click="selected = !selected; moveTo(e)">
    <li ng-class="{'selected': selected}">{{e | uppercase}}</li>
   </a>
 </div>
</ul>

JS：

$scope.moveTo = function(e){
 var target = $("."+e);
 if(e === "about"){
  $('html, body').animate({
        scrollTop: 0
  }, 1000);
 }else{
  $('html, body').animate({
        scrollTop: target.offset().top
  }, 1000);
 }
};

NG-CLICK需要双击才能触发

1 个答案: