亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

重用 Angular 9 組件

重用 Angular 9 組件

森欄 2023-03-24 15:29:06
我有一個文件上傳組件,app-file-upload它有一個文件類型和一個文件變量列表。一切正常,直到我想app-file-upload在同一頁面上有多個組件。我期望的是,當我單擊第一個文件上傳按鈕時,它會填充第一個列表app-file-upload。然后當我點擊第二個文件上傳按鈕時,上傳的文件將進入第二個組件的列表。實際發生的是第二個文件列表將轉到第一個組件的列表。就好像第二個組件只是第一個組件的引用。問題:我知道角度服務是作為單例創建的。組件也是??這沒有意義,因為要重用組件。還是我做錯了什么?
查看完整描述

2 回答

?
FFIVE

TA貢獻1797條經驗 獲得超6個贊

這是一個簡單的文件上傳組件,可以按您的需要工作。

此鏈接的演示:https ://angular-upload-csvx.stackblitz.io/

完整代碼和額外內容:https://stackblitz.com/edit/angular-upload-csvx

//files.component.ts

import {Component} from '@angular/core';


@Component({

  'templateUrl': './files.component.html',

  'selector': 'app-files'

})


export class FilesComponent {

  handleFileSelect(evt) {

    var files = evt.target.files; // FileList object

    var file = files[0];

  }


}

<!--files.component.html-->

<div>

  <form>

    <div>

      <input type="file" (change)="handleFileSelect($event)">

    </div>

  </form>

</div>

<!--app.component.html-->

<div>

  <app-files></app-files>

  <hr>

  <app-files></app-files>

  <hr>

  <app-files></app-files>  

</div>


查看完整回答
反對 回復 2023-03-24
?
守候你守候我

TA貢獻1802條經驗 獲得超10個贊

我發現了問題。我有一個用于輸入類型文件的標簽(下面的代碼)。我需要做的就是生成一個隨機數并分配給的for和label的。idinput


 <label for="file-{{uniqueNumber}}" (click)="handleUploadClick()">

        <th-icon-upload></th-icon-upload>

        {{buttonText}}

    </label>

 <input type="file" id="file-{{uniqueNumber}}" [attr.multiple]="multiple ? '' : null" (change)="handleFileInput($event.target.files)" accept="{{acceptableFiles}}" 

        [attr.disabled]="successFilesCount >= maximumNumberOfFiles ? '' : null" />



查看完整回答
反對 回復 2023-03-24
  • 2 回答
  • 0 關注
  • 156 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號