How can I combine [checked] to precheck and ngModel to bind with the function at the same time?

So I have two observable to promise arrays, skills is to populate the checkbox with ngFor and the other one is to check the checkboxes on page load if the objects of competences is in skills. I have also a function afterwards that depends on the skills checked will add to the database. [checked] in presence of [(ngModel)] doesn't work. I don't know how to combine them together, please help.

competences.component.html

    <ion-card-content>
    <div id ="research">
        <ion-searchbar placeholder="Ex: Piano"  [(ngModel)]="search" type="text" maxlength="20"></ion-searchbar>
    </div>
    <ion-item *ngFor="let skill of skills | filter:search">
        <div>
            <ion-label></ion-label>
            <ion-label></ion-label>
        </div>
        <ion-checkbox slot="start" [checked]="isInArray(skill)" [(ngModel)]="skill.checked" (ionChange)="onChange(skill)" ></ion-checkbox>
    </ion-item>
</ion-card-content>

competences.component.ts

import {Component, OnInit} from '@angular/core';
import {SkillService} from '../../services/skill.service';
import {UserService} from '../../services/user.service';

@Component({
  selector: 'app-competences',
  templateUrl: './competences.component.html',
  styleUrls: ['./competences.component.scss'],
})
export class CompetencesComponent implements OnInit {
  skills = [];
  search: string;
  competences = [];

  constructor(
      private skillService: SkillService,
      private userService: UserService) {
  }

  async ngOnInit() {
    this.competences = await this.getCompetences();
    this.skills = await this.getSkills();
  }
  isInArray(value) {
    return this.competences.findIndex((val) => val.title === value.title) > -1;
  }
  getCompetences() {
    return this.skillService.getUserCompetence(localStorage.getItem('userMail')).toPromise();
  }
  getSkills() {
    return this.skillService.getSkills().toPromise();
  }

  onChange(skill) {
    if (skill.checked == true) {
      this.userService.addUserCompetence(localStorage.getItem('userMail'), skill.title).subscribe();
    } else if (skill.checked == false) {
      this.userService.deleteUserCompetence(localStorage.getItem('userMail'), skill.title).subscribe();
    }
  }
}