Scope in @Directive

[LalitAgrawala004]

Hi
I am trying to convert an existing directive using @directive decorator. This existing directive's controller method has $scope injected. When I am trying to inject $scope in decorator class's constructor I am getting provider error.. Any idea how to access $scope in @directive class..

[vsternbach]

Can you give me a more detailed example?

[LalitAgrawala004]

I have something like

export default function testDirective($parse){
	'ngInject';

	return {
		restrict: 'AE',
		
		controller: function($scope, $attrs, TestService, $element){
			'ngInject';
			//logic here
		}
	};
}

in the controller function, we have $scope, $attrs $element injected.. I am converting it to @directive decorator class.. how would i achieve this?

I tried to do it as below -

@Directive({
	selector: '[test-directive]'
})
export class testDirective implements IDirective {
	public compile(elem: IAugmentedJQuery) {
	 	elem.css('display', 'none');
	}
	constructor(
		private $scope: any
		private $attrs:IAttributes,
		private $element: IAugmentedJQuery,
	) {
		'ngInject';
	}
}

but getting provider error in constructor.. So.. I removed the constructor and tried to implement link and controller functions as it is in IDirective interface.. but those are not getting executed only compile function is getting executed..

[vsternbach]

Since angular 2+ doesn't have analogs for compile or link functions you should move all of your code into controller, angular-ts-decorators has support for legacy link and compile as follows, if there's compile method defined on directive's class then it will be used, if there's no compile method, but link method, then it will be used(in both cases class itself isn't instantiated, i.e. injection in the constructor isn't executed), if both aren't defined, then the class itself will be used as directive's controller with the injection in it's constructor.

[vsternbach]

fixed in 2eef743