Syed mohamed aladeen
Syed mohamed aladeen

Reputation: 6755

ToggleMask in primeNg password not working

I try to use passwordModule in my code, which is working fine then I tried to add toggle mask

<input id="float-password"
               type="password"
               [toggleMask]="true"
               pPassword />

it gives me the following error

Can't bind to 'toggleMask' since it isn't a known property of 'input'.

I have tried to find the reason and fix, but unfortunately I'm not getting it.

Upvotes: 1

Views: 4912

Answers (1)

Sameer
Sameer

Reputation: 5188

Use component selector instead of the directive, as directive does not contain toggleMask (See here) where as the component does.

Make sure to import PasswordModule

import { PasswordModule } from "primeng/password";

@NgModule({
  imports: [
    ...
    PasswordModule,
  ]
})
export class AppModule {}

and use it like so

<p-password [toggleMask]="true"></p-password> //Works

Stackblitz Example

BTW, pPassword directive has showPassword @Input which can be used to toggle password display

Upvotes: 2

Related Questions