Is it possible to upgrade angularjs atttribute directives to use in angular 4?

A Attribute directive can totally have the Input property which can be passed to it from the tag where it's used : For ex:

<p highlightThis [highlightColor]="'orange'" [count]="5">Highlighted in orange</p>

Also make sure your appModule/SharedModule imports it.

So the problem i see is with the way you are defining your structural directive. A structural directive doesn't have any template structure attached to it. It applies to any html tag where it's used.

For you case, i see you are extending the directive with Component class which is not acceptable to a Attribute directive :--

MakeGreenDirective extends UpgradeComponent {

You should keep the Attribute Directive separate from any Component. For Ex:

  import { Directive, ElementRef, Injector, Input, Output, EventEmitter } from   '@angular/core';  @Directive({    selector: '[highlightThis]'   }) export class HighLightThisDirective { @Input() count: number; @Input() highlightColor: string; @Output() clicked: EventEmitter<number>; constructor(private elementRef: ElementRef, injector: Injector) {  } ngOnInit(): void {   this.decorateMyTag(); } private decorateMyTag(): void {   console.log("highlightColor", this.highlightColor);   this.elementRef.nativeElement.style.backgroundColor = this.highlightColor;  }}