diff --git a/docs/en/UI/Angular/CapsLock.directive.md b/docs/en/UI/Angular/CapsLock.directive.md index 4b92d61124..a21057490c 100644 --- a/docs/en/UI/Angular/CapsLock.directive.md +++ b/docs/en/UI/Angular/CapsLock.directive.md @@ -5,15 +5,17 @@ In password inputs,You may want to show if Caps Lock is on. To make this even ea ## Getting Started -In order to use the `TrackCapsLockDirective` in an HTML template, the **`CoreModule`** should be imported into your module like this: +`TrackCapsLockDirective` is standalone. In order to use the `TrackCapsLockDirective` in an HTML template, import it to related module or your standalone component: ```ts -// ... -import { CoreModule } from '@abp/ng.core'; +import { TrackCapsLockDirective } from '@abp/ng.core'; @NgModule({ //... - imports: [..., CoreModule], + imports: [ + ..., + TrackCapsLockDirective + ], }) export class MyFeatureModule {} ``` @@ -25,6 +27,8 @@ The `TrackCapsLockDirective` is very easy to use. The directive's selector is ** See an example usage: ```ts +import { TrackCapsLockDirective } from '@abp/ng.core' + @Component({ selector: 'test-component', standalone: true, @@ -34,7 +38,8 @@ See an example usage: icon - ` + `, + imports: [ TrackCapsLockDirective ] }) export class TestComponent{ capsLock = false; @@ -49,4 +54,4 @@ See the result: To see Caps Lock icon press Caps Lock. -![Show Password directive](./images/CapsLockDirective2.png) \ No newline at end of file +![Show Password directive](./images/CapsLockDirective2.png)