Почему не работает запуск и симуляция нажатия кнопок из машинописного кода в html? - PullRequest
0 голосов
/ 05 декабря 2018

У меня есть компонент кнопки в моем navbar.component.html, как показано ниже.Я хотел бы смоделировать и вызвать нажатие кнопки Upload из navbar.component.ts file.Когда я нажимаю кнопку Upload, он автоматически открывает селектор файлов, например, на моем Mac, он находит.Затем я выбираю файл, и он загружается в бэкэнд.Я хочу добиться того же действия, но используя машинописный код.Поэтому я просто хочу смоделировать, так как пользователь нажмет кнопку «Загрузить», что приведет к открытию селектора файлов, и тогда все остальные действия будут такими же, как и при нажатии кнопки.Есть идеи, почему это не работает?Я сделал все, как было показано здесь .

В navbar.component.ts:

      event.preventDefault();
      let element: HTMLElement = document.getElementById('trigger') as HTMLElement;
      element.click()

Я также попробовал:

  @ViewChild('myTrigger') myTrigger: ElementRef;

this.myTrigger.nativeElement.click();
              let el: HTMLElement = this.myTrigger.nativeElement as HTMLElement;
              el.click();

uploadFile():

uploadFile(){

    this.UploaderService.uploader = new FileUploader({url: URL + localStorage.getItem('current_path') + '/', autoUpload: true , itemAlias: 'file', authToken: 'token ' + localStorage.getItem('userToken')});



    this.UploaderService.uploader.onCompleteItem = (item:any, response:any , status:any, headers:any) => {

            this.UploaderService.displayAllFiles();
            this.ExecuteWhenSidebarClose();
        }

                this.UploaderService.uploader.onBeforeUploadItem = (item) => {
        item.withCredentials = false;
}


this.UploaderService.uploader.onAfterAddingFile = (item) => {
  // item.method = "PUT";
  item.withCredentials = false;
}

}

В navbar.component.html:

<li class='nav-item sidebar-false-upload' *ngIf="isCloud() && !sidebarVisible">
  <label #myTrigger id="trigger" (click)="this.uploadFile()" data-toggle="collapse" aria-controls="navbarToggler" aria-expanded="false" aria-label="Toggle navigation"
    class="pretty-file nav-link">
    <i class="nc-icon nc-cloud"></i>Upload

    <div id="fileSelector">
      <input type="file" name="fileUplaod" id="fileUpload" multiple ng2FileSelect [uploader]="this.UploaderService.uploader">
    </div>
  </label>
</li>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...