diff --git a/frontend/app/components/work-packages/wp-single-view/wp-single-view.directive.html b/frontend/app/components/work-packages/wp-single-view/wp-single-view.directive.html
index c48dc5b06a..d5efacddae 100644
--- a/frontend/app/components/work-packages/wp-single-view/wp-single-view.directive.html
+++ b/frontend/app/components/work-packages/wp-single-view/wp-single-view.directive.html
@@ -112,9 +112,6 @@
       </div>
     </div>
 
-    <wp-attachments
-        wp-single-view-ctrl="$ctrl"
-        work-package="$ctrl.workPackage">
-    </wp-attachments>
+    <wp-attachments work-package="$ctrl.workPackage"></wp-attachments>
   </div>
 </div>
diff --git a/frontend/app/components/work-packages/wp-single-view/wp-single-view.directive.ts b/frontend/app/components/work-packages/wp-single-view/wp-single-view.directive.ts
index 077dda719d..781df3d636 100644
--- a/frontend/app/components/work-packages/wp-single-view/wp-single-view.directive.ts
+++ b/frontend/app/components/work-packages/wp-single-view/wp-single-view.directive.ts
@@ -36,25 +36,22 @@ import {WorkPackageEditFormController} from '../../wp-edit/wp-edit-form.directiv
 import {WorkPackageNotificationService} from '../../wp-edit/wp-notification.service';
 
 export class WorkPackageSingleViewController {
-  public formCtrl:WorkPackageEditFormController;
-  public workPackage:WorkPackageResourceInterface;
+  public formCtrl: WorkPackageEditFormController;
+  public workPackage: WorkPackageResourceInterface;
   public singleViewWp;
-  public groupedFields:any[] = [];
-  public hideEmptyFields:boolean = true;
-  public attachments:Array<any>;
-  public text:any;
-  public scope:any;
+  public groupedFields: any[] = [];
+  public hideEmptyFields: boolean = true;
+  public attachments: any[] = [];
+  public text: any;
+  public scope: any;
 
-  protected firstTimeFocused:boolean = false;
+  protected firstTimeFocused: boolean = false;
 
   constructor(protected $scope,
-              protected $window,
-              protected $state,
               protected $stateParams,
-              protected loadingIndicator,
               protected I18n,
               protected wpCacheService,
-              protected wpNotificationsService:WorkPackageNotificationService,
+              protected wpNotificationsService: WorkPackageNotificationService,
               protected WorkPackagesOverviewService,
               protected SingleViewWorkPackage) {
 
@@ -75,6 +72,10 @@ export class WorkPackageSingleViewController {
     $scope.$on('workPackageUpdatedInEditor', () => {
       this.wpNotificationsService.showSave(this.workPackage);
     });
+
+    if (this.workPackage && this.workPackage.attachments) {
+      this.attachments = this.workPackage.attachments.elements;
+    }
   }
 
   public shouldHideGroup(group) {
@@ -112,7 +113,7 @@ export class WorkPackageSingleViewController {
     this.workPackage.schema.$load().then(schema => {
       this.setFocus();
 
-      var otherGroup:any = _.find(this.groupedFields, {groupName: 'other'});
+      var otherGroup: any = _.find(this.groupedFields, {groupName: 'other'});
       otherGroup.attributes = [];
 
       angular.forEach(schema, (prop, propName) => {
@@ -138,7 +139,7 @@ function wpSingleViewDirective() {
   function wpSingleViewLink(scope,
                             element,
                             attrs,
-                            controllers:[WorkPackageEditFormController, WorkPackageSingleViewController]) {
+                            controllers: [WorkPackageEditFormController, WorkPackageSingleViewController]) {
 
     controllers[1].formCtrl = controllers[0];
 
diff --git a/frontend/app/components/wp-attachments/wp-attachments.directive.ts b/frontend/app/components/wp-attachments/wp-attachments.directive.ts
index ef6447d01b..857ec43ddd 100644
--- a/frontend/app/components/wp-attachments/wp-attachments.directive.ts
+++ b/frontend/app/components/wp-attachments/wp-attachments.directive.ts
@@ -34,34 +34,30 @@ import {WorkPackageResourceInterface} from '../api/api-v3/hal-resources/work-pac
 import {CollectionResourceInterface} from '../api/api-v3/hal-resources/collection-resource.service';
 
 export class WorkPackageAttachmentsController {
-  public text:any;
+  public text: any;
 
-  public workPackage:WorkPackageResourceInterface;
-  public wpSingleViewCtrl;
+  public workPackage: WorkPackageResourceInterface;
 
-  public attachments:any[] = [];
-  public fetchingConfiguration:boolean = false;
-  public files:File[] = [];
-  public hasRightToUpload:boolean = false;
-  public loading:boolean = false;
-  public rejectedFiles:any[] = [];
+  public attachments: any[] = [];
+  public fetchingConfiguration: boolean = false;
+  public files: File[] = [];
+  public hasRightToUpload: boolean = false;
+  public loading: boolean = false;
+  public rejectedFiles: any[] = [];
 
   public settings = {
     maximumFileSize: null
   };
 
-  public size:any;
+  public size: any;
 
   private currentlyFocusing;
 
-  constructor(protected $scope:any,
-              protected $element:ng.IAugmentedJQuery,
-              protected wpCacheService:WorkPackageCacheService,
-              protected NotificationsService:any,
-              protected wpNotificationsService:WorkPackageNotificationService,
-              protected I18n:op.I18n,
-              protected ConfigurationService:any,
-              protected ConversionService:any) {
+  constructor(protected $scope: any,
+              protected wpCacheService: WorkPackageCacheService,
+              protected wpNotificationsService: WorkPackageNotificationService,
+              protected I18n: op.I18n,
+              protected ConfigurationService: any) {
 
     this.text = {
       dropFiles: I18n.t('js.label_drop_files'),
@@ -70,11 +66,7 @@ export class WorkPackageAttachmentsController {
       removeFile: arg => I18n.t('js.label_remove_file', arg)
     };
 
-    if (angular.isDefined(this.wpSingleViewCtrl)) {
-      this.wpSingleViewCtrl.attachments = this.attachments;
-    }
-
-    this.hasRightToUpload = angular.isDefined(this.workPackage.addAttachment) || this.workPackage.isNew;
+    this.hasRightToUpload = !!this.workPackage.addAttachment || this.workPackage.isNew;
 
     this.fetchingConfiguration = true;
     ConfigurationService.api().then(settings => {
@@ -100,7 +92,7 @@ export class WorkPackageAttachmentsController {
 
   private registerEditObserver() {
     scopedObservable(this.$scope, this.wpCacheService.loadWorkPackage(<number> this.workPackage.id))
-      .subscribe((wp:WorkPackageResourceInterface) => {
+      .subscribe((wp: WorkPackageResourceInterface) => {
         this.workPackage = wp;
         this.loadAttachments(true);
       });
@@ -108,7 +100,7 @@ export class WorkPackageAttachmentsController {
 
   private registerCreateObserver() {
     scopedObservable(this.$scope, this.wpCacheService.onNewWorkPackage())
-      .subscribe((wp:WorkPackageResourceInterface) => {
+      .subscribe((wp: WorkPackageResourceInterface) => {
         wp.uploadAttachments(this.attachments).then(() => {
           // Reload the work package after attachments are uploaded to
           // provide the correct links, in e.g., the description
@@ -117,27 +109,24 @@ export class WorkPackageAttachmentsController {
       });
   }
 
-  public upload():void {
+  public upload(): void {
     if (this.workPackage.isNew) {
-      this.files.forEach((file) => {
-        this.attachments.push(file);
-      });
-
-      return;
+      this.attachments.push(...this.files);
     }
-
-    if (this.files.length > 0) {
-      this.workPackage.uploadAttachments(<any> this.files).then(() => {
-        this.files = [];
-      });
+    else if (this.files.length > 0) {
+      this.workPackage
+        .uploadAttachments(<any> this.files)
+        .then(() => {
+          this.files = [];
+        });
     }
   };
 
-  public loadAttachments(refresh:boolean = true):ng.IPromise<any> {
+  public loadAttachments(refresh: boolean = true): ng.IPromise<any> {
     this.loading = true;
 
     return this.workPackage.attachments.$load(refresh)
-      .then((collection:CollectionResourceInterface) => {
+      .then((collection: CollectionResourceInterface) => {
         this.attachments.length = 0;
         angular.extend(this.attachments, collection.elements);
       })
@@ -146,48 +135,48 @@ export class WorkPackageAttachmentsController {
       });
   }
 
-  public remove(file):void {
+  public remove(file): void {
     if (!this.workPackage.isNew && file._type === 'Attachment') {
-      file.delete()
-        .then(() => this.workPackage.updateAttachments())
+      file
+        .delete()
+        .then(() => {
+          this.workPackage.updateAttachments();
+        })
         .catch(error => {
-          this.wpNotificationsService.handleErrorResponse(error, this.workPackage);
+          this.wpNotificationsService.handleErrorResponse(error, this.workPackage)
         });
     }
 
     _.pull(this.attachments, file);
   }
 
-  public focus(attachment:any):void {
+  public focus(attachment: any): void {
     this.currentlyFocusing = attachment;
   };
 
-  public focusing(attachment:any):boolean {
+  public focusing(attachment: any): boolean {
     return this.currentlyFocusing === attachment;
   };
 
-  public filterFiles(files):void {
+  public filterFiles(files): void {
     // Directories cannot be uploaded and as such, should not become files in
     // the sense of this directive.  The files within the directories will
     // be taken though.
-    _.remove(files, (file:any) => {
-      return file.type === 'directory';
-    });
+    _.remove(files, (file: any) => file.type === 'directory');
   };
 
-  public uploadFilteredFiles(files):void {
+  public uploadFilteredFiles(files): void {
     this.filterFiles(files);
     this.upload();
   }
 }
 
-function wpAttachmentsDirective():ng.IDirective {
+function wpAttachmentsDirective(): ng.IDirective {
   return {
     restrict: 'E',
     templateUrl: '/components/wp-attachments/wp-attachments.directive.html',
     scope: {
-      workPackage: '=',
-      wpSingleViewCtrl: '='
+      workPackage: '='
     },
 
     bindToController: true,