Display data in angular form

Question

I'm trying to display the data i transfered already from another component into my form. here is my interface :

I tried to use the ngModel but it didnt work. here is my code :

form.ts :

import { Component, OnInit} from '@angular/core';
import {NgForm} from '@angular/forms';
import { Route } from '@angular/router';
import { SharedService } from '../services/shared.service';

@Component({
  selector: 'app-repo',
  templateUrl: './repo.component.html',
  styleUrls: ['./repo.component.scss']
})
export class RepoComponent implements OnInit {
  data = this.shared.getData();       

  constructor( private router: Router, private shared: SharedService ) {
    if(this.data){
      console.log(this.data);
    }
    else{
      this.router.navigateByUrl('/Deals');
    } 
  }
  ngOnInit(): void {
  }
}

form.html:

 <form #form="ngForm"  autocomplete="off" >
    <div class="form-group">
        <label>Deal Class</label>
        <input required type="text" id="dealclass"  name="Dealclass" [(ngModel)]="data.DEALCLASS" style="width: 400px;"> 
      </div>
</form>**

Thank you and have a great day :)

Answer 1

try this

constructor( private router: Router, private shared: SharedService ) {
if(this.data){
this.form.setValue(this.data.rowData); //<-- set value in ngFrom
  console.log(this.data);
}
else{
  this.router.navigateByUrl('/Deals');
} 

}