[解決済み】Angularでファイルアップロード?
2022-04-13 06:53:03
質問
これは非常に一般的な質問ですが、私はAngular 2でファイルをアップロードすることに失敗しています。 私は試してみました
1) http://valor-software.com/ng2-file-upload/ と
2) http://ng2-uploader.com/home
...が、失敗しました。Angularでファイルをアップロードした方はいらっしゃいますか?どのような方法を使用しましたか?どのように行うのですか?サンプルコードやデモのリンクがあれば、本当に感謝します。
解決方法は?
Angular 2はファイルのアップロードに優れたサポートを提供します。サードパーティのライブラリは必要ありません。
<input type="file" (change)="fileChange($event)" placeholder="Upload file" accept=".pdf,.doc,.docx">
fileChange(event) {
let fileList: FileList = event.target.files;
if(fileList.length > 0) {
let file: File = fileList[0];
let formData:FormData = new FormData();
formData.append('uploadFile', file, file.name);
let headers = new Headers();
/** In Angular 5, including the header Content-Type can invalidate your request */
headers.append('Content-Type', 'multipart/form-data');
headers.append('Accept', 'application/json');
let options = new RequestOptions({ headers: headers });
this.http.post(`${this.apiEndPoint}`, formData, options)
.map(res => res.json())
.catch(error => Observable.throw(error))
.subscribe(
data => console.log('success'),
error => console.log(error)
)
}
}
angular/core": "~2.0.0" と @angular/http: "~2.0.0" を使用します。
関連
-
Angularフレームワーク入門
-
[解決済み] Angular [disabled]="MyBoolean "が動作しない。
-
[解決済み] Angular HTMLバインディング
-
[解決済み] jQuery Ajax ファイルアップロード
-
[解決済み] HTTPファイルアップロードの仕組みを教えてください。
-
[解決済み] Angular HttpClient "パース中のHttp失敗"
-
[解決済み] エラーが発生しました。出力が初期化されていません
-
[解決済み] イベントリスナーを動的に追加する
-
[解決済み] Angular 2でシングルトンサービスを作成するには?
-
[解決済み] VSCodeでAngularをデバッグする方法とは?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
Angularフレームワーク入門
-
angularjs ポップアップボックスの方法1
-
[解決済み] 最後のページに戻るには
-
[解決済み] ExpressionChangedAfterItHasBeenCheckedErrorの説明
-
[解決済み] Angular 2の "select "で新しい選択範囲を取得するにはどうすればよいですか?
-
[解決済み] Angularのエラーです。"Can't bind to 'ngModel' because it isn't a known property of 'input'"."
-
[解決済み] 予算内の警告、初期値で最大値を超える
-
[解決済み] Angular HttpClient "パース中のHttp失敗"
-
[解決済み] Angular 2 http.post()がリクエストを送信しない
-
[解決済み] Angular Compiler は TypeScript >=3.4.0 と <3.5.0 を要求しているが、代わりに 3.5.3 が検出された