Question

我有一个与当前隐藏的段落关联的工具提示，我希望在我的控制器中发生事件后显示它。

我的HTML代码是 -

  <div ng-controller="DemoCtrl as ctrl" layout="column" ng-cloak>
    <p>Use <code>md-autocomplete</code> to search for matches from local or remote data sources.
      <md-tooltip hide md-direction="left">
        Refresh
      </md-tooltip>     
    </p>  
  </div>

我的控制器代码是 -

  angular
  .module('starterApp')
  .controller('DemoCtrl', DemoCtrl);


function DemoCtrl($mdDialog,$mdToast) {
    var self = this;
    //I want to show the tooltip from here.
    //if(event) mdTooltip.show()


  }

此问题与link不重复，因为我没有触发器，例如data-trigger =＆＃34; hover＆＃34;。触发器将根据另一个事件来自控制器内。

Answer 1

您可以使用md-tooltip md-visible属性执行此操作。请参阅文档here。

设置工具提示，如下所示：

<p>Use <code>md-autocomplete</code> to search for matches from local or remote data sources.
  <md-tooltip ng-if="showTooltip" md-visible="showTooltip" md-direction="left">
    Refresh
  </md-tooltip>     
</p>

你可以看到一个工作的plunker here

希望有所帮助

Answer 2

我会在控制器中创建一个设置值showTooltip的方法。当事件触发时，它将showToottip设置为true / false。然后使用ng-show =＆＃34; showTooltip＆＃34;

显示/隐藏工具提示

angular
    .module('starterApp')
    .controller('DemoCtrl', DemoCtrl);


function DemoCtrl($mdDialog, $mdToast) {
    var self = this;
    //I want to show the tooltip from here.
    //if(event) mdTooltip.show()

    self.showTooltip = false;

    self.changeTooltipStatus = function (status) {
        self.showTooltip = status
    }
}

然后在你的HTML中做这样的事情

<md-tooltip ng-show="showTooltip" md-direction="left">
    Refresh
</md-tooltip>

md工具提示从控制器显示

2 个答案: