Angular 6：无法绑定到“上传者”答案

【问题标题】：Angular 6 : Can't bind to 'uploader'Angular 6：无法绑定到“上传者”
【发布时间】：2018-10-14 22:07:49
【问题描述】：

我正在尝试将使用 ng2-file-upload 模块的视频上传到我的应用程序中。

这是我得到的错误：

ERROR in : Can't bind to 'uploader' since it isn't a known property of 'input'. (">single</label>
                <input type="file" class="form-control" name="single" ng2FileSelect [ERROR ->][uploader]="uploader" />
              </div>
            </div>
")

app\app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpClientModule } from '@angular/common/http';
import { TranslateModule } from '@ngx-translate/core';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
import { FileUploadModule} from 'ng2-file-upload';

import { CoreModule } from '@app/core';
import { SharedModule } from '@app/shared';
import { HomeModule } from './home/home.module';
import { ShellModule } from './shell/shell.module';
import { AboutModule } from './about/about.module';
import { LoginModule } from './login/login.module';
import { AppComponent } from './app.component';
import { AppRoutingModule } from './app-routing.module';
import {AppContentModule} from '@app/app-content/appContent.module';

@NgModule({
  imports: [
    BrowserModule,
    FormsModule,
    HttpClientModule,
    TranslateModule.forRoot(),
    NgbModule,
    CoreModule,
    SharedModule,
    ShellModule,
    HomeModule,
    AppContentModule,
    AboutModule,
    LoginModule,
    FileUploadModule,
    AppRoutingModule // must be imported as the last module as it contains the fallback route
  ],
  declarations: [AppComponent],
  providers: [
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

video.component.ts

import {Component, Input, OnInit} from '@angular/core';
import {NgbModal} from '@ng-bootstrap/ng-bootstrap';
import {FormBuilder, FormGroup, Validators} from '@angular/forms';
import { FileUploader } from 'ng2-file-upload';

@Component({
  selector: 'app-video',
  templateUrl: './video.component.html',
  styleUrls: ['./video.component.scss']
})
export class VideoComponent implements OnInit {
  @Input() data: any;

  public uploader:FileUploader = new FileUploader({url:'http://46.101.253.10:3000/upload'});

  constructor(private modalService: NgbModal,
              private formBuilder: FormBuilder) { }
  ngOnInit() {
  }  
}

video.component.html

<div class="form-group">
                <label for="single">single</label>
                <input type="file" class="form-control" name="single" ng2FileSelect [uploader]="uploader" />                                  
              </div>

我在我的 app.module 中为“FileUploadModule”尝试了多种导入组合，但不适用于我。

已经在谷歌上搜索了许多相同的解决方案，但没有任何帮助

有人可以帮我吗？

【问题讨论】：

在你声明VideoComponent的NgModule中导入FileUploadModule
我在这里可能错了，但我认为 ng2-file-upload 模块不适合 angular 6。angular 2 和 angular 6 之间有很多变化，看起来好像这里的模块很久没有更新了（上一次发布差不多是2年前）。您是否尝试过使用ng build --prod 构建您的应用程序？我很确定这也应该导致某种形式的错误。我强烈建议切换到与 angular 6 兼容的不同模块。

标签： angular angular6 ng2-file-upload

【解决方案1】：

我没有足够的声誉来发表评论，所以在这里添加它：

你在哪里导入 VideoComponent 它不是 app.module 的一部分？

还，看看this 的回答。好像是支持的。除了缺少Video component 之外，我认为与您的解决方案没有太大区别

【讨论】：