Uploading a file with Angular2

I currently have a lot of problems when it comes to this. I tried to use ng2-file-upload , but it turns out that it is giving me an error that I don't understand.

Mistake

ERROR Error: Uncaught (in promise): Error: No component factory found for TaskComponent. Did you add it to @NgModule.entryComponents?
noComponentFactoryError@http://localhost:4200/vendor.bundle.js:3565:34 [angular]

      

He gave me an error No component factory found for TaskComponent

. This only happens when I have @Directive

inside my component.

Edited TaskComponent.ts

import { Directive, Component, OnInit,  OnDestroy, ViewChild, EventEmitter } from '@angular/core';
import { Router, ActivatedRoute, Params } from '@angular/router';
import { Http, Response, Headers } from '@angular/http';
import { FileUploader } from 'ng2-file-upload/ng2-file-upload';

import { ModalDirective } from 'ng2-bootstrap/modal/modal.component';

import { ApiService } from '../../assets/services/api.service';

import { UploadOutput, UploadInput, UploadFile, humanizeBytes } from 'ngx-uploader';

// class FileSelectDirective
@Directive({ selector: '[ng2FileSelect]' })

@Component({
            selector: 'app-task',
            templateUrl: './task.component.html',
            styleUrls: ['./task.component.scss']
})
export class TaskComponent implements OnInit {
    ngOnInit(){}
}

      

I also imported this into my module.

RtoModule.ts

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule, ReactiveFormsModule }   from '@angular/forms';
import { BrowserModule } from '@angular/platform-browser';
import { ModalModule } from 'ng2-bootstrap/modal';
import { FileUploadModule } from 'ng2-file-upload';

import { TaskComponent } from '../task/task.component';
import { TaskDetailsComponent } from '../task-details/task-details.component';

import { RtoRoutingModule } from '../rto-routing/rto-routing.module';

@NgModule({
  imports: [
    CommonModule,
    RtoRoutingModule,
    FormsModule,
    ReactiveFormsModule,
    FileUploadModule,
    ModalModule.forRoot()
  ],
  declarations: [
    TaskComponent,
    TaskDetailsComponent
  ]
})
export class RtoModule { }

      

Can someone point me to where I did wrong? Wherever in implementation or not.

Thank you in advance!

PS: I'm currently using the Angular4 version in this project

+3


source to share


1 answer


It seems that I was wrong when implementing this module.

Somehow it works now, no errors on my component. I am implementing these codes on my component

  public uploader:FileUploader = new FileUploader({url: URL});
  public hasBaseDropZoneOver:boolean = false;
  public hasAnotherDropZoneOver:boolean = false;

      



It now works correctly. They are currently developing a backend.

Thanks to everyone who answered my question!

0


source







All Articles