AngularJS鼠标事件在循环中多次触发

Question

我试图在鼠标悬停元素setHighlight时触发该功能li.该ng-mouseover事件是在设置ng-repeat循环.

问题是,当我悬停li元素时,ng-mouseover会多次触发.触发次数等于迭代次数.这是我的代码片段:

<ul>
    <li ng-repeat="review in foodReviews" ng-mouseover="setHighlight(review.id)">
        <h4>{{review.name}}</h4>
        <b>{{review.stars}} Stars</b>
        <i> -- {{review.location}} </i><br />
        <blockquote> {{review.description}} </blockquote>
        <br/> written by {{review.author}}
    </li>
</ul>

我把悬停事件放在了错误的地方吗？

Answer 1

鼠标悬停事件发生在元素或其任何子元素悬停的任何时候.因此,每当您将鼠标悬停在li内的h4上时,都会触发另一个鼠标悬停事件.您应该使用mouseenter事件.

ng-mouseenter="setHighlight(review.id)"