Selected option Angular 4, ngValue don't work

Im trying to have a selected option when I receive the object workOrder.supplier, I tryed NgValue, ng-selected, compareWith but dont work, I dont know Why... this project use Angular 4. You have another option to I try?

<md-select class="suppliers-list" placeholder="Selecione Sua Empresa" [(ngModel)]="workOrder.supplier" formControlName="supplier" name="supplier" [disabled]="schedulingDisabled" >
      <md-option *ngFor="let supplier of suppliers" [value]="supplier" >
        {{ supplier.corporateName }}                                    
      </md-option>
</md-select>

Edited:

Try this.. this worked for me. Your question is bit unclear of what you are trying to do. In order to clarify remove the disabled property and see.

<md-select formControlName="supplier" [(ngModel)]="workOrder.supplier">
       <md-option *ngFor="let supplier of suppliers" [value]="supplier">{{supplier.displayName}}                                   </md-option>
</md-select>

edited: The TS that get the info

newWorkOrder() {
let newWorkOrder = new WorkOrder();
// se verdadeiro, pega os dados que vieram do Plano de manutenção ou do editar
if (this.workOrderService.getOSCache() !== null && this.workOrderService.getOSCache() !== undefined) {
  this.workOrderService.getOSCache().subscribe(res => {
    newWorkOrder = res;
    this.selectedSupplier = res.supplier;
    if (res.initialDate != null) {
      this.selectedDateInitial = new Date(res.initialDate);
    }
    if (res.finalDate != null) {
      this.selectedDateFinal = new Date(res.finalDate);
    }
    this.workOrderService.clearOSCache();
  });
} else {
  newWorkOrder.initializeWithJSON(this.createForm());
}
return newWorkOrder;

}

Upvotes: 0

Views: 246

Answers (1)

Selaka Nanayakkara
Selaka Nanayakkara

Reputation: 6878

Im still not clear of what you are asking.. I Assume that you want to capture the value in the ts file in selected input in template file.

<md-select formControlName="supplier" [(ngModel)]="workOrder.supplier" (change)="newWorkOrder(selectedSupplier.value)" #selectedSupplier>
       <md-option *ngFor="let supplier of suppliers" [value]="supplier">{{supplier.displayName}}                                   </md-option>
</md-select>

And in your ts file :

newWorkOrder(selectedValue:any) {
  console.log(selectedValue);
}

In this solution I have used something called angular template refferencing. You can read more about it in the official angular documentation here

Upvotes: 0

Related Questions