diff --git a/docs/node-permission.directive.md b/docs/node-permission.directive.md
index f82e56dbdb..2a6e956770 100644
--- a/docs/node-permission.directive.md
+++ b/docs/node-permission.directive.md
@@ -90,16 +90,23 @@ export class UploadDragAreaComponent implements NodePermissionSubject {
 
 ### Defining your components as an EXTENDIBLE_COMPONENT parent component
 
-The directive will look up the component in the dependency injection tree, up to at most one step above the current DI level (@Host). Because of this, you have to provide your component with forward referencing as the EXTENDIBLE_COMPONENT.
+The directive will look up the component in the dependency injection tree, up to the @Host() component.
+
+> "The host component is typically the component requesting the dependency. **But when this component is projected into a parent component, that parent component becomes the host.**"
+
+- because of this, you have to provide your component with forward referencing as the EXTENDIBLE_COMPONENT.
+- because of the emphasized second sentence you have to provide your component as a viewProvider.
 
 ```js
 import { EXTENDIBLE_COMPONENT } from 'ng2-alfresco-core';
 
 @Component({
     ...
-    providers: [
+    viewProviders: [
         { provide: EXTENDIBLE_COMPONENT, useExisting: forwardRef(() => UploadDragAreaComponent)}
     ]
 })
 export class UploadDragAreaComponent implements NodePermissionSubject { ... }
-```
\ No newline at end of file
+```
+
+**Notice the usage of viewProviders (instead of providers)! This part is very important, especially if you want to use this directive on a transcluded component!**
diff --git a/lib/content-services/upload/components/upload-button.component.ts b/lib/content-services/upload/components/upload-button.component.ts
index 7e4eefd748..59151e5dac 100644
--- a/lib/content-services/upload/components/upload-button.component.ts
+++ b/lib/content-services/upload/components/upload-button.component.ts
@@ -46,8 +46,8 @@ import 'rxjs/add/observable/throw';
     selector: 'adf-upload-button',
     templateUrl: './upload-button.component.html',
     styleUrls: ['./upload-button.component.scss'],
-    providers: [
-        {provide: EXTENDIBLE_COMPONENT, useExisting: forwardRef(() => UploadButtonComponent)}
+    viewProviders: [
+        { provide: EXTENDIBLE_COMPONENT, useExisting: forwardRef(() => UploadButtonComponent) }
     ],
     encapsulation: ViewEncapsulation.None
 })
diff --git a/lib/content-services/upload/components/upload-drag-area.component.ts b/lib/content-services/upload/components/upload-drag-area.component.ts
index 3b93276e8b..b29000424d 100644
--- a/lib/content-services/upload/components/upload-drag-area.component.ts
+++ b/lib/content-services/upload/components/upload-drag-area.component.ts
@@ -31,7 +31,7 @@ import { Component, EventEmitter, forwardRef, Input, Output, ViewEncapsulation }
     selector: 'adf-upload-drag-area',
     templateUrl: './upload-drag-area.component.html',
     styleUrls: ['./upload-drag-area.component.css'],
-    providers: [
+    viewProviders: [
         { provide: EXTENDIBLE_COMPONENT, useExisting: forwardRef(() => UploadDragAreaComponent)}
     ],
     encapsulation: ViewEncapsulation.None