htmlangularjshoverui-sref

angular ui-sref on tr - link not visible

I placed ui-sref attribute in tr element.

<tr ui-sref="test" ng-repeat="d in data">

Everything runs well, but I would like the link to 'test' to be visible in the bottom of the browser when hover the row of the table. Is there a way to obtain it?

Solution 

  • angular.module('myApp',[])
  .controller('MyCtrl', function(){
    this.model = {};
  });
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.6/angular.min.js"></script>

<div ng-app="myApp" ng-controller="MyCtrl as myCtrl">

<span ng-mouseover="myCtrl.model.mouseIsOver = true"
     ng-mouseout="myCtrl.model.mouseIsOver = false">
     Hover me
</span>

<div ng-if="myCtrl.model.mouseIsOver">
test
</div>

</div>

    Not really related to ui-router but you can do this with built in directives in the ng main module.