angular - 工具提示未显示在正确的位置

Question

我在我的应用程序中使用 MatTooltipModule

<div class="input-group" matTooltipPosition="right"
     matTooltip= "If you have multiple valve sizes this cost of ownership form needs to be completed for each size.">
  <input class="form-control" type="number" [(ngModel)]="cons.valveNumber" [ngModelOptions]="{standalone: true}"/>
</div>

但是当我运行代码时，工具提示位于左侧而不是右侧。为什么它显示在左侧？

编辑:如果工具提示不适合右侧，matTooltipModule 会自动将它移到左侧吗？如果是，你怎么能把它留在右边呢？

Answer 1

因为你应该使用[matTooltipPosition]="'right'" ，不要忘记括号并传递一个字符串(我猜你的意思是 right 在你的情况下是一个字符串，而不是一个保存字符串的变量)。

这是工具提示位置的完整列表:

"before"
"after"
"above"
"below"
"left"
"right"

我还建议看一下 "after"位置，可能正是您要找的。