python ruby-programming-language Smalltalk Vue.js Knockoutjs TypeScript JavaScript, OOPs JavaScript Angular 8,7,6,5,4 and 2 Interview Questions and Answers Angular 8,7,6,5,4 and 2 Interview Questions and Answers Angular 4 Angular 2 AngularJs 1.x NodeJs Perl Programming R Programming RequireJs Rust Programming Backbonejs closure programming language go-programming-language kotlin-programming-language
7 Directives decorator

How to Create Custom Directives?

Create a Custom Directives -
Let's start to create a simple directive. For more detail kindly refer the link.... 

I assuming you have installed the Angular CLI and all the necessary configurations are running in your app. Now, go to your project directory and execute the below CLI command for creating your custom directive –
ng g directive myCustom

After execute the above CLI command, created two files in the project - src/app folder
1.      src/app/my-custom.directive.spec.ts
2.      src/app/my-custom.directive.ts
And update files reference automatically in your project module – “src/app/app.module.ts”

Lest see in the code-sample, how it look like-
my-custom.directive.ts –
import { Directive } from '@angular/core';

@Directive({
  selector: '[appMyCustom]'
})
export class MyCustomDirective {
  constructor() { }
}


And app.module.ts –
import { MyCustomDirective } from './my-custom.directive'

//AppModule class with @NgModule decorator
@NgModule({
  //Static, this is the compiler configuration
  //declarations is used for configure the selectors.
  declarations: [
    AppComponent,
    MyCustomDirective,
  ],
  //Composability and Grouping
  //imports used for composing NgModules together.
  imports: [
    BrowserModule
  ], 
  //Runtime or injector configuration
  //providers is used for runtime injector configuration.
  providers: [],
  //bootstrapped entry component
  bootstrap: [AppComponent]
})
export class AppModule { }

ANIL SINGH

Hi there! Welcome to my blog. My name is Anil Singh. I'm a author of this blog. For more detail about me, kindly refer to this link..
My Blogs - http://code-sample.com and http://code-sample.xyz
My Books - Interview Questions and Answers Books- Get Your Book in 15+ Digital Stores Worldwide..

You Might Also Like
www.code-sample.com/. Powered by Blogger.
ASK Questions