Ionic 2/3 : How to programmatically uncheck a check box - ionic2

Question

I have a situation wherein I have to uncheck a checkbox, onclick of a button.
This is my checkbox code
<ion-checkbox [checked]="!isChecked" [disabled]="!isdisabled" (ionChange)="saveProfile($event)" [(ngModel)]="default"></ion-checkbox>
I have tried using !iChecked, but it doesn't work. Basically, if the checkbox is already checked by the user, I want it to be unchecked (based on certain conditions) when you click a button.
<button class="button-m" (click)="navigateTo()" ion-button color="secondary"><ion-icon name="next"> </ion-icon> Next </button>
TS file
import { Component, ViewChild } from '#angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { ToastController } from 'ionic-angular';
#Component({
selector: 'choose-profile',
templateUrl: 'choose-profile.html',
})
export class ChooseProfilePage {
profileValue : string;
isdisabled : boolean;
isChecked :boolean;
constructor(public navCtrl: NavController, public navParams: NavParams, private toastCtrl: ToastController) {
}
getSelectedProfile(val){
this.profileValue = val;
if(this.profileValue!=undefined){
this.isdisabled = true;
}
else{
this.isdisabled = false;
}
}
saveProfile(val){
if(val.checked==true)
{
this.presentToast( this.profileValue+"set as default profile")
}
else
{
this.presentToast("No default profile")
}
}
presentToast(val){
let toast = this.toastCtrl.create({
message: val,
duration: 3000,
position: 'top'
});
toast.present();
}
navigateTo()
{
console.log("Next Clicked")
this.isChecked == true;
}
}

Answer 1

You have an error in your code. this.isChecked == true; does not set the isChecked variable to true. It merely does a comparison to check if isChecked is true.
You should use = instead of ==.
Alter your code to be as following:
navigateTo()
{
console.log("Next Clicked")
this.isChecked = true;
}

Answer 2

Don't use the checked attribute as a binding. Your input is bound with ngModel so what you need to do is change the value of that field.
I'm surprised after fixing the double equals your code worked because the template is looking for default and sets the checked attribute based on it's value. Create a variable and bind to it, then change it. I rewrote your component a bit
And then in your component:
import { Component, ViewChild } from '#angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { ToastController } from 'ionic-angular';
#Component({
selector: 'choose-profile',
templateUrl: 'choose-profile.html',
})
export class ChooseProfilePage {
public shouldSaveProfile = false;
profileValue : string;
isdisabled : boolean;
constructor(public navCtrl: NavController, public navParams: NavParams, private toastCtrl: ToastController) { }
getSelectedProfile(val){
this.profileValue = val;
this.isdisabled = this.profileValue ? true : false;
}
saveProfile(val){
if(this.shouldSaveProfile)
this.presentToast( this.profileValue+"set as default profile")
else this.presentToast("No default profile")
}
presentToast(val){
let toast = this.toastCtrl.create({
message: val,
duration: 3000,
position: 'top'
});
toast.present();
}
navigateTo()
{
this.shouldSaveProfile = true;
console.log("Next Clicked, should save value:", this.shouldSaveProfile);
}
}