0

我对 AngularJS 比较陌生，并且喜欢它的每一刻！我有一个无序列表的产品。当用户将鼠标悬停在它们上方时，我需要在列表元素上active设置一个类。我目前正在这样做：

<ul>
    <li ng-repeat="product in products" ng-mouseover="showDetails(product, $event)" ng-class="{active: current == product}">{{product}}</li>
</ul>

我的showDetails如下：

function showDetails(product, $event) {
    $scope.current = product;
    ...some other logic...
}

现在，一切正常，但是，我想知道是否可以在没有 ng-repeat 并且没有product绑定变量的情况下设置类？

<ul>
    <li ng-mouseover="showDetails($event)" ng-class="{<i don't know what to put here> }">foo</li>
    <li ng-mouseover="showDetails($event)" ng-class="{<i don't know what to put here> }">bar</li>
    <li ng-mouseover="showDetails($event)" ng-class="{<i don't know what to put here> }">A</li>  
    <li ng-mouseover="showDetails($event)" ng-class="{<i don't know what to put here> }">B</li>
</ul>

这次我应该如何编写我的 showDetails 函数来设置类？我的第一次尝试是：

function showDetails($event) {
    var text = $event.target.textContent;
    $scope.current = text
}

但是我在 ng-class 属性中做了什么？

4

1 回答 1

1

如果无法使用纯 CSS 解决方案，那么您可以在其中创建一个directive并使用 JQuery 切换一个 CSS 类directive。将指令ul作为属性或类应用。在那个指令中你可以做

iElement.find("li").hover(...
于 2013-05-13T04:50:39.293 回答