Angulaire 2 Case Les Deux Sens De La Liaison De Données

Im assez nouveau pour Angular2 et j'ai un petit problème:

Dans mon Login-Composant-HTML, j'ai deux cases à cocher, qui je veux lier dans les deux sens de la liaison de données pour la Connexion Composante-Tapuscrit.

C'est le HTML:

<div class="checkbox">
<label>
    <input #saveUsername [(ngModel)]="saveUsername.selected" type="checkbox" data-toggle="toggle">Save username
</label>
</div>

Et c'est le Composant.ts:

import { Component, OnInit }    from '@angular/core';
import { Router }               from '@angular/router';
import { Variables }            from '../../services/variables';
@Component({
selector: 'login',
moduleId: module.id,
templateUrl: 'login.component.html',
styleUrls: ['login.component.css']
})
export class LoginComponent implements OnInit {
private saveUsername: boolean = true;
private autoLogin: boolean = true;
constructor(private router: Router, private variables: Variables) { }
ngOnInit() { 
this.loginValid = false;
//Get user name from local storage if you want to save
if (window.localStorage.getItem("username") === null) {
this.saveUsername = true;
this.autoLogin = true;
console.log(this.saveUsername, this.autoLogin);
} else {
console.log("init", window.localStorage.getItem("username"));
}
}
login(username: string, password: string, saveUsername: boolean, autoLogin: boolean) {
this.variables.setUsername(username);
this.variables.setPassword(password);
this.variables.setIsLoggedIn(true);
console.log(saveUsername, autoLogin);
//this.router.navigate(['dashboard']);
}

Si je clique sur une case, j'obtiens la valeur correcte dans le contrôleur (composant).

Mais si je change la valeur de par exemple saveUsername dans le composant, la case à cocher ne pas "get" la nouvelle valeur.

Donc je ne peux pas manipuler la case à cocher de la Composante (comme je veux faire dans la ngOnInit dans le composant.

Merci pour votre aide!

InformationsquelleAutor Junias | 2016-10-24