带有Angular工具提示的Disabled Bootstrap 4按钮

Question

我正在尝试使用ngx-bootstrap和Angular创建一个Bootstrap 4按钮。但是，只有将鼠标悬停在禁用按钮的图标上才会显示工具提示。如何将鼠标悬停在禁用按钮上的任意位置以显示工具提示。

代码： 仅将鼠标悬停在图标上有效

var title = "bar.doc";
  var folderTitle = "GoogleApplicationScriptTesting" ;
  var doc = DocumentApp.create ( title );
  var docId = doc.getId ();                     // retrieve the document unique id
  var docFile = DriveApp.getFileById ( docId ); // then get the corresponding file


  // Use the DriveApp folder creation and navigation mechanisms either:
  // getFoldersByName returns a folderIterator so you need to do additional checking


 var folderIter = DriveApp.getFoldersByName(folderTitle);


  if(folderIter.hasNext()) {
    Logger.log('Folder already exists');
    var folder = folders.next();
  } 

  else{
    var folder = DriveApp.createFolder(folderTitle);
    Logger.log('New folder created!');
  }
  folder.addFile ( docFile );

}

这是一个有效的示例： https://stackblitz.com/edit/ngx-bootstrap-rmnmf1

Answer 1

一种可能的解决方案是在按钮内部创建工具提示。它将开始显示<button>标签内的所有内容的工具提示

<button type="button" class="btn btn-primary" disabled>
  <span tooltip="hello" [isDisabled]="false">
    <i class="fa fa-book-open"></i> btn disabled
  </span>
</button>