So, basically i have a textbox and file upload button . What i want when user enter integer in textbox for eg :10 then i want to display file upload button 10 times.
Here is a working demo hope it will helpful for you.
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
function AppendRow(e) {
var val = e.value;
if (val !== "") {
var html ='';
for (var i = 0; i < val; i++) {
html +='<input type="file" id="file">';
}
$("#append").empty().append(html);
}
}
</script>
</head>
<body>
<input type="text" id="input1" onkeyup="AppendRow(this)"/>
<div id="append">
<div>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("input").keyup(function(){
var val = $(this).val();
if (val !== "") {
var html;
for (var i = 0; i < val; i++) {
html = '<input type="file" id="file">';
$("#append").append(html);
}
}
});
});
</script>
</head>
<body>
<input type="text" id="input" />
<div id="append">
</div>
</body>
</html>
Please use the following code
<input [(ngModel)]="count" />
<div *ngFor="let item of [].constructor(count); ">
<input type='file'>
</div>