page navigationend change angular2 angular typescript data-binding components decorator

navigationend - router events subscribe angular 4



Angular2 Component @Input enlace bidireccional (1)

Tengo una aplicación Angular basada en datos. Tengo un componente de conmutación que paso en un estado conmutado. Mi problema es que el enlace de datos bidireccional no parece funcionar a menos que pase el toggle boolean como un objeto. ¿Hay alguna manera de hacer que esto funcione sin usar un EventEmitter o pasar la variable como un objeto ? Este debe ser un componente reutilizable y la aplicación se basa en gran medida en datos, por lo que pasar el valor como un objeto no es una opción. Mi codigo es ....

toggle.html

<input type="checkbox" [(ngModel)]="toggled" [id]="toggleId" name="check"/>

toggle.component.ts

import { Component, Input, EventEmitter, Output } from ''@angular/core''; @Component({ moduleId: module.id, selector: ''toggle-switch'', templateUrl: ''toggle-switch.component.html'', styleUrls: [''toggle-switch.component.css''] }) export class ToggleSwitchComponent { @Input() toggleId: string; @Input() toggled: boolean; }

parent.component.html

<toggle-switch toggleId="toggle-1" [(toggled)]="nongenericObject.toggled"></toggle-switch>


Para que [(toggled)]="..." funcione, necesita

@Input() toggled: boolean; @Output() toggledChange: EventEmitter<boolean> = new EventEmitter<boolean>(); changeValue() { this.toggled = !(this.toggled); this.toggledChange.emit(this.toggled); }

Véase también Enlace bidireccional