Datenbindung Angular 4

Question

Ich habe eine Komponente mit einer Variablen sagen "ID" und in dieser Komponente rufe ich einen Dienst, der diese Variable (ID) als Parameter nehmen, in meiner Vorlage ich den Wert eines Radio Button zuweisen auf die Variable (ID) .. das Problem ist .. Ich rufe meinen Service in "ngOnInit()", so dass es nicht den Wert der Radio-Taste, sondern nimmt den Anfangswert der "ID" .. Hier ist mein Code:

in meiner Komponente:

import { Component, OnInit } from '@angular/core'; 
import { BartersService } from '../../core/services/barters.service'; 

export class BarterViewComponent implements OnInit { 
id:string=""; 
allCategories ; 
constructor(private barServ: BartersService) { } 
    ngOnInit() { 
    this.barServ.findByPage(this.id) 
    .subscribe(respone => { 
    this.allCategories = respone.data; 
    }); 

    } 
onSelectionChange(val) { 
    this.id = val; 
} 

} 

in meiner Vorlage:

<div *ngFor="let cat of allCategories ; let i=index;">        
    <input style="margin-bottom: 10px;" type="radio" #R 
     (change)="onSelectionChange(R.value)" name="rad" value="cat['id']"> 
     {{cat['name']}} 
</div> 

Ziel:

das Ziel den Blick auf die Auswahl des Optionsfelds basiert aktualisieren.

Answer 1

Sie können dies versuchen:

export class BarterViewComponent implements OnInit { 
id:string=""; 
allCategories ; 

constructor(private barServ: BartersService) { } 
ngOnInit() { 
    refreshCategories() 
} 

onSelectionChange(val) { 
    this.id = val; 
    refreshCategories() 
} 

refreshCategories() { 
    this.barServ.findByPage(this.id).subscribe(respone => { 
     this.allCategories = respone.data; 
    }); 
} 
} 

Answer 2

Ändern Sie diese

value="cat['id']" 

zu

[value]="cat['id']" oder value="{{cat['id']}}"