Установка значения по умолчанию для угловой формы - PullRequest
0 голосов
/ 31 декабря 2018

Я хочу знать, каков правильный подход при предварительном заполнении angular-form значением по умолчанию.Должен ли я внедрить в компонент, содержащий форму nullable ввода?(Я повторно использую ту же форму для Create и Update, и я хотел бы, чтобы в одном случае fields было предварительно заполнено, а в другом пустом:

Форма

export class UserFormComponent implements OnInit {
  @Output()
  submitEvent:EventEmitter<User>=new EventEmitter<User>();


  @Input()
  formSettings:FormSettings;
  ngOnInit(): void {
    console.log("init form");
  }
  submit(userForm:NgForm):void{
    this.submitEvent.emit(userForm.value);
  }
}

Форма HTML

<form  #userForm="ngForm" (ngSubmit)="submit(userForm)">

  <div class="panel-heading">
    <h3 class="panel-title">User Form </h3>
  </div>
  <div class="panel-body"></div>

    <div id="required-group">
        <div class="form-group">
            <label>Id</label>
            <input id="id" [(ngModel)]="id" type="text" class="form-control" name="id">
        </div>
      </div>
  <div class="panel-footer">
      <button type="submit" class="btn btn-primary">Save</button>
  </div>
 </form>

Создать компонент

export class CreateComponent implements OnInit {
 public useOptional:boolean=true;
 public formSettings:FormSettings={
   isEditable:true
 }

 async onSubmitClicked(data:User):Promise<void>{
  console.log(data["value"]);

   var result=await this.userservice.createClientAsync(data);
   console.log("Result of creation:"+result);
   if(result){
    this.router.navigateByUrl('/index');
   }
 }
}

Создать компонент HTML

<div id="childForm">
        <app-user-form [formSettings]="formSettings" (submitEvent)="onSubmitClicked($event)" >              
        </app-user-form>
</div>

Как вы можете видеть в Create HTML, я не отправляю никаких входных данных. Для Update подход будет заключаться в том, чтобы отправить входные данные в качестве значения по умолчанию для заполнения формы?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...