how to create custom directive in angular code example

Example 1: pass value to custom directive angularjs

<div class="photoframe">
  <img src="{{gImg.thumbnailUrl}}" url="{{gImg.imageUrl}}" image-gallery>
</div>
 myApp.directive('imageGallery',function(){
return {
    restrict: 'A',
    scope: {
      url: '@'
    },
    controller: function($scope){
        console.log($scope.url);
    }
}
});

Example 2: custom directives in angular 8

<h1 appHightlight>Highlight Me !</h1>

Example 3: user defined directives in angular 7

import { Directive, ElementRef } from '@angular/core';

Example 4: user defined directives in angular 7

<p [ngStyle]="{`THE CSS YOPU WANT TO ADD`}"> I am an Attribute Directive</p>