您好，我有兩個組件。組件 1 有一個用于上傳視頻的輸入元素。它有一個變數檔案
<input
type="file"
accept=".mp4"
#file
/>
現在我有 Component2 它是一個共享組件：
<button (click)="file.click()">upload video</button>
現在我需要傳遞給共享組件的“file”變數來執行 file.click();
我不能在共享組件中取輸入元素
https://stackblitz.com/edit/angular-ivy-9wi6qs?file=src/app/component1/component1.component.html
uj5u.com熱心網友回復：
這就像將值發送到組件一樣簡單：
@Component({
selector: 'app-component1',
templateUrl: './component1.component.html',
styleUrls: ['./component1.component.css']
})
export class Component1Component implements OnInit {
constructor() { }
public fileAddress: string;
public fileChanged(event) {
// read the file when it changes and store it locally
if(event.target.files.length > 0)
this.fileAddress = event.target.files[0].name;
}
}
ngOnInit() {
}
}
<!-- bind the event handler -->
<input type="file" accept=".mp4" (change)="fileChanged($event)" />
<!-- bind the local variable to an input on the child component -->
<app-upload-video [fileAddress]="fileAddress"></app-upload-video>
@Component({
selector: 'app-upload-video',
templateUrl: './upload-video.component.html',
styleUrls: ['./upload-video.component.css']
})
export class UploadVideoComponent implements OnInit {
//input variable to receive the value inside the component
@Input()
public fileAddress: string;
constructor() { }
ngOnInit() {
}
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/359754.html
標籤：javascript 有角的 打字稿