Bootstrap-highlight Chỉ thị động và góc

Question

Tôi đang cố gắng chọn mục đã chọn trên thanh điều hướng Bootstrap được tô sáng. Đây là mã của tôi:

<ul class="nav navbar-nav navbar-left" top-bar> 

và chỉ thị:

a.directive('topBar', function() { 
return { 
    restrict: 'AE', 
    link: function (scope, elem, attrs) { 
     $(elem).on("click", function() { 
      $(elem).find(".active").removeClass("active"); 
      $(this).parent().addClass("active"); 
     }); 
    } 
} 

});

Nó chỉ hoạt động nếu tôi xóa lớp = "nav navbar-nav navbar-left". Nếu không, nó không đi vào chỉ thị. Bất kỳ đề xuất?

Cảm ơn

Answer 1

Tôi đoán bạn muốn nghe nhấp chuột vào mục danh sách (tag li) trong thành phần và cập nhật các lớp học của mình. Cố gắng sử dụng event delegation - nếu bạn đang sử dụng jQuery, chỉ cần bổ sung thêm selector vào on gọi:

a.directive('topBar', function() { 
    return { 
     restrict: 'AE', 
     link: function (scope, elem, attrs) { 
      elem.on("click", "li", function (e) { 
       elem.find(".active").removeClass("active"); 
       $(this).addClass("active"); 
      }); 
     } 
    }; 
}); 

Answer 2

sử dụng mã này. có thể nó giúp bạn ...

app.directive('topBar', function() { 
    return { 
     restrict: 'AE', 
     link: function (scope, elem, attrs) { 
      $(elem).on("click", function() { 
      $(".active").removeClass("active"); 
      $(elem).addClass("active"); 

      }); 
     } 
    } 
}); 

see this link