工具提示无法在C＃中工作（剃刀页面）

Question

我需要为我的项目提供一个简单的工具提示，在工具提示内部我想显示＆＃34;时间戳＆＃34; （参数）。当我将鼠标悬停在圆圈（我的代码示例中定义）时，我需要显示时间戳。我尝试了以下，但似乎没有用。这是我的代码。 `

＆＃13;

＆＃13;

<style>
.tooltip {
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted black;
}

.tooltip .tooltiptext {
  visibility: hidden;
  width: 120px;
  background-color: #555;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;
  position: absolute;
  z-index: 1;
  bottom: 125%;
  left: 50%;
  margin-left: -60px;
  opacity: 0;
  transition: opacity 0.3s;
}

.tooltip .tooltiptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
  opacity: 1;
}

</style>

＆＃13;

<div ng-repeat="p in page.watchhistory track by $index">
  <marker class="tooltip " ng-repeat="a in p track by $index" position="{{a.Location.position}}" icon="{{p.iconData}}" title="{{a.Timestamp}}">
  </marker>
</div>

<script>
  app.controller('mapCtrl', ['$scope', '$http', 'serviceBasePath', 'NgMap', 'Hub', 'ColorService', function($scope, $http, serviceBasePath, NgMap, Hub, ColorService) {
  var page = this;
  page.map = map;

});

  page.watchhistory = [];
  var previousDate = ''; page.watchdevicehistory = function(device) {
  if (device.DeviceId) {
    var currentDate = device.UpdatedTimestamp ? device.UpdatedTimestamp : device.LastUpdateTimestamp;
    page.p.BtnHistory = false;
    if (device.hasMore) {
      $http.get(serviceBasePath + '/api/Map/DeviceLocationsInfo', {
        params: {
          DeviceId: device.DeviceId,
          CurrentDate: currentDate
        }
      }).then(function(response) {
        if (response.data) {
          device.UpdatedTimestamp = response.data.NextLocationTimestamp;
          device.hasMore = response.data.HasMore;
          page.watchhistory[device.index] = response.data.DeviceLocations.concat(page.watchhistory[device.index]);
          page.watchindex = device.index;
          page.watchhistory[device.index].iconData = {
            path: 'CIRCLE',
            scale: 3,
            strokeColor: ColorService.Color[device.index]
          };
          console.log(page.watchhistory);
        }
      }, function(error) {})
    } else {
      page.p.BtnHistory = true;
    }
  }
  }

  }]);
</Script>

＆＃13;

＆＃13;

＆＃13;

` Here is how my output window looks like当我将鼠标悬停在蓝点（参考图像）时，我需要显示＆＃34;时间戳＆＃34;。非常感谢帮助！感谢。

Answer 1

尝试设置Marker元素的标题属性：

<div ng-repeat="p in page.watchhistory track by $index">
  <marker class="tooltip" 
       ng-repeat="a in p track by $index" 
       position="{{a.Location.position}}" icon="{{p.iconData}}"
       title="'{{a.Timestamp}}'">
  </marker>
</div>