gpt4 book ai didi

html - 将 tabindex 设置为 Angular 材​​料元素

转载 作者:行者123 更新时间:2023-12-05 05:00:03 25 4
gpt4 key购买 nike

我有一个使用 Angular Material 创建的密码字段。那里有一个密码可见性切换按钮。如果它是一个简单的按钮,我可以设置 tabindex="-1",但 tabindex 不适用于“mat-pass-toggle-visibility”

                  <mat-form-field appearance="fill" style="width: 100%;" class="input-custo-design">
<mat-label>Password</mat-label>
<mat-pass-toggle-visibility #toggle matSuffix></mat-pass-toggle-visibility>

<input matInput [type]="toggle.type" placeholder="Password" formControlName="pass" #passwordWithValidation />
<mat-error *ngIf="signupController.pass.errors?.required">Password is required
</mat-error>

</mat-form-field>

enter image description here

我有一个 github 链接 mat-password ,这个问题在哪里,但目前我能以某种方式解决这个问题吗??

在 chrome 开发工具中,我可以看到“mat-pass-toggle-visibility”最终只创建了一个按钮。所以我们可以设置任何指令或类似的东西。

最佳答案

对于我的用例,我有另一种解决方法:使用普通按钮类

<mat-form-field appearance="fill" style="width: 100%;" class="input-custo-design">
<mat-label>Password</mat-label>
<input matInput [type]="hideSignUp ? 'password' : 'text'" placeholder="Password" formControlName="pass" #passwordWithValidation />

<button
type="button"
mat-icon-button
matSuffix
(click)="hideSignUp = !hideSignUp"
[attr.aria-label]="'Hide password'"
[attr.aria-pressed]="hide"
tabindex="-1"
>
<mat-icon>{{
hideSignUp ? "visibility_off" : "visibility"
}}</mat-icon>
</button>
<mat-error *ngIf="signupController.pass.errors?.required">Password is required</mat-error>
</mat-form-field>

关于html - 将 tabindex 设置为 Angular 材​​料元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/63293492/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com