我有每週有多個不同時間段的角碼。它們都在ng-repeat內。我希望能夠在鼠標懸停在該項目上時更改時間段的顏色。用我現在的代碼,顏色獲得ng-repeat中每個項目的變化。更改ng-repeat中單個元素的樣式
public onSegmentMouseOverLeave(changeSegmentColor : boolean) : void {
this.timeSegmentColor = changeSegmentColor;
}
.time-segment-grid {
position: absolute;
top: 0;
margin-top: 2px;
height: 35px;
border-radius: 5px;
cursor: pointer;
z-index: 1;
#gradient > .vertical(#1b9dd0, #0080b5);
}
.time-segment-grid-onmove {
position: absolute;
top: 0;
margin-top: 2px;
height: 35px;
border-radius: 5px;
cursor: pointer;
z-index: 1;
#gradient > .vertical(#f442d7, #0080b5);
}
<div>
<div ng-repeat="timeSegment in $ctrl.deal.deal_settings.dayparting.schedule[dayName] track by $index">
<span ng-class="$ctrl.daypartingTimeSegments.timeSegmentColor ? 'time-segment-grid' : 'time-segment-grid-onmove' "
ng-style="$ctrl.daypartingTimeSegments.timeSegmentGridStyle(timeSegment)"
ng-mousedown="$ctrl.daypartingTimeSegments.onSegmentDragStart($event, dayName, $index, 'dragFullContent')"
ng-mouseover="$ctrl.daypartingTimeSegments.onSegmentMouseOverLeave(false)"
ng-mouseleave="$ctrl.daypartingTimeSegments.onSegmentMouseOverLeave(true)">
</span>
</div>
</div>
大這個工作謝謝! – BrianM