Adding a [(ngModel)] to a component tag

Question


<div *ngFor="let file of files" name="durl" [(ngModel)]="project.durl" >
  <app-upload-task [file]="file"></app-upload-task>
</div>

Good day, Im new to Angular and i would like to ask if i can use ngModel in this format in my above code to get project.durl from upload task component or how can i go about it. Thank you

`ngModel` basically is used for HtmlElements which takes in input from user like `input` | `select`. Can you kindly elaborate why you want to use `ngModel` in `div` element and what are you trying to achieve? — Chenna, Jul 04 '20 at 03:36
you cant get it this way. You need to declare app-upload-task as @ViewChildren in parent component and get the property from there — ihor.eth, Jul 04 '20 at 04:38
It's in a form format, the url of the picture i want to post to my node.js server and mongoose is in that upload task component so i would like to use the component tag — Chris, Jul 04 '20 at 09:33

score 0 · Answer 1 · answered Jul 04 '20 at 04:47

Haven't tested but this should be super close to what you are looking for

Parent HTML

<div *ngFor="let file of files">
  <app-upload-task [file]="file"></app-upload-task>
</div>

Parent.ts

@Component({
  selector: 'my-app-parent',
  templateUrl: './parent.component.html',
  styleUrls: [ './parent.component.css' ]
})

export class ParentComponent implements AfterViewInit {
  @ViewChildren(UploadTaskComponent) viewChildren: QueryList<UploadTaskComponent>;
  ...
  ngAfterViewInit() {
     var project = this.viewChildren.find(your_predicate_to_find_necessary_child);
  }
}

Adding a [(ngModel)] to a component tag

1 Answers1