From 9613bfa4404c074b0aba4db8a63fa5859f83f58f Mon Sep 17 00:00:00 2001
From: sumeyye <sum.the.developer@gmail.com>
Date: Wed, 9 Jul 2025 17:12:16 +0300
Subject: [PATCH] update:  show password directive page

---
 .../ui/angular/show-password-directive.md     | 38 ++++---------------
 1 file changed, 8 insertions(+), 30 deletions(-)

diff --git a/docs/en/framework/ui/angular/show-password-directive.md b/docs/en/framework/ui/angular/show-password-directive.md
index cacb2550c5..423d388a4b 100644
--- a/docs/en/framework/ui/angular/show-password-directive.md
+++ b/docs/en/framework/ui/angular/show-password-directive.md
@@ -4,24 +4,20 @@ In password input, text can be shown easily via changing input type attribute to
 
 
 ## Getting Started
-`ShowPasswordDirective` is standalone. In order to use the `ShowPasswordDirective` in an HTML template, import it to related module or your standalone component:
+`ShowPasswordDirective` is standalone. In order to use the `ShowPasswordDirective` in an HTML template, import it to your component:
 
-**Importing to NgModule**
+**Importing to Component**
 ```ts
 import { ShowPasswordDirective } from '@abp/ng.core';
 
-@NgModule({
+@Component({
   //...
-  declarations: [
-   ...,
-   TestComponent
-  ],
   imports: [
-   ...,
+   // ...,
    ShowPasswordDirective
   ],
 })
-export class MyFeatureModule {}
+export class TestComponent {}
 ```
 
 ## Usage
@@ -30,28 +26,10 @@ The `ShowPasswordDirective` is very easy to use. The directive's selector is **`
 
 See an example usage:
 
-**NgModule Component usage**
-```ts
-@Component({
-  selector: 'test-component',
-  template: `
-    <div class="d-flex flex-column">
-      <label>Password</label>
-      <input [abpShowPassword]="showPassword"/>
-      <i (click)="showPassword = !showPassword">icon</i>
-    </div>
-  `
-})
-export class TestComponent{
-  showPassword = false;
-}
-```
-**Standalone Component usage**
 ```ts
 import { ShowPasswordDirective } from '@abp/ng.core';
 @Component({
-  selector: 'standalone-component',
-  standalone: true,
+  selector: 'sample-component',
   template: `
     <div class="d-flex flex-column">
       <label>Password</label>
@@ -59,9 +37,9 @@ import { ShowPasswordDirective } from '@abp/ng.core';
       <i (click)="showPassword = !showPassword">icon</i>
     </div>
   `,
-  imports: [ShowPasswordDirective]
+  imports: [ ShowPasswordDirective ]
 })
-export class StandaloneComponent{
+export class SampleComponent{
   showPassword = false;
 }
 ```