Angular 2 mit BehaviorSubject in benutzerdefinierten RadioButton

Question

Ich muss benutzerdefinierte RadioButtons erstellen. Wenn einer ausgewählt wird, ruft er einen Dienst auf, der seine Kennung an alle abonnierten RadioButtons einschließlich des Anrufers sendet. Wenn der Subskribent sieht, dass der Schlüssel (instance + id) NICHT derselbe ist wie er selbst, wird er sich selbst abwählen, andernfalls bleibt die übereinstimmende instance + id (die tatsächlich der Aufrufer ist) wie überprüft. Der Service:

import { Injectable } from '@angular/core'; 
import { BehaviorSubject} from 'rxjs/BehaviorSubject'; 
import {Subject} from 'rxjs/Subject'; 

@Injectable() 
export class RadioButtonService { 
    public Status_Subject: Subject<string> = new BehaviorSubject<string>('x;y'); 
    constructor() { 
    } 
    public setRadioChecked(instance: string, id: string) { 
    const key = instance + ';' + id; 
    this.Status_Subject.next(key); 
    } 
} 

Relevante Teil der Komponente:

export class RadioButtonComponent implements AfterViewInit, OnDestroy { 
    @Input() id: string; 
    @Input() instanceId: string; 
    @Input() group: string; 
    isdisabled = false; 
    ischecked = false; 
    subj: Subject<string>; 
    constructor(private radSvc: RadioButtonService) { 
    this.subj = this.radSvc.Status_Subject; 
    } 

    ngAfterViewInit() { 
    this.subj.subscribe(
     (key) => { 
     const parts = key.split(';'); 
     this.ischecked = (key[0] !== this.instanceId || key[1] !== this.id ? false : true); 
     } 
    ); 
    } 

    ClickEvent($event) { 
    if (!this.isdisabled) { 
     this.ischecked = !this.ischecked; 
     this.radSvc.setRadioChecked(this.instanceId, this.id); // tell the world we got clicked 
     // send to Store(instanceId, id, value); 
    } 
    } 

Die AfterViewInit() initialisiert das Thema der Komponente (glaube ich) und soll für den Dienst warten, um zu nennen. Wenn ich auf einen Radiobutton klicke, ClickEvent in der Komponente aufgerufen wird, bin ich zur Funktion setRadioChecked im Service gegangen, der nächste (Schlüssel) scheint ausgeführt zu werden, wird aber nie vom AfterViewInit-Abonnement der Komponente abgefangen.

Was fehlt mir?

Danke für die Hilfe :-)

Answer 1

habe ich eine plunkr mit Ihrem Code, und ich bin in der Lage, alles zu bekommen, arbeitet gut: plnkr.co/edit/WzZvZNU6S8uPOb85gqZO