我一直在寻找一些时间并阅读ng-repeat创建它自己的范围,但仍然找不到解决方案。
我想在每个.event-window element
上触发一次鼠标悬停事件。使用ng-mouseover="hoverIn()"
不起作用。我期望因为尝试调用不属于范围的函数,而只调用父(父)范围的一部分,因为调用在不使用ng-repeat创建的元素中正常工作。
<div class="day-window" ng-repeat="day in weekObject['days']">
<div ng-repeat="event in day.events track by $index">
<div class="event-window" ng-style="{'height': (event.length)+'px',
'position': 'absolute',
'top':(1565/24)*(event.offsetTop-1) +'px',
'left': getLeftCoords(event.colliding)+'%',
'width': 100/event.colliding+'%',
'background': event.color,
'opacity': 0.8}" ng-mouseover="hoverIn()">
<p>{{event.title}}</p>
<p>[{{event.startTime |date:'H:mm'}} - {{event.endTime |date:'H:mm'}}]</p>
</div>
</div>
控制器
$scope.hoverIn = function() {
alert('hoverIn');
}
在我的CSS中悬停不起作用。是否被ng-style覆盖?
.event-window:hover {
opacity: 1.0 !important;
}
您可以找到演示here,但我无法复制问题。我的代码中必定存在一些错误。