IONIC using nativeAudio

It's working but I think it got too big

<ion-grid>
    <ion-row align-items-center>
      <ion-col>
        <button ion-button block outline (click)="play1()">bā</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play2()">bá</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play3()">bǎ</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play4()">bà</button>
      </ion-col>
    </ion-row>
    <ion-row align-items-center>
      <ion-col>
        <button ion-button block outline (click)="play5()">pā</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play6()">pá</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play7()">pǎ</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play8()">pà</button>
      </ion-col>
    </ion-row>
    <ion-row align-items-center>
      <ion-col>
        <button ion-button block outline (click)="play9()">mā</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play10()">má</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play11()">mǎ</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play12()">mà</button>
      </ion-col>
    </ion-row>
    <ion-row align-items-center>
      <ion-col>
        <button ion-button block outline (click)="play13()">fā</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play14()">fá</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play15()">fǎ</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play16()">fà</button>
      </ion-col>
    </ion-row>
    <ion-row align-items-center>
      <ion-col>
        <button ion-button block outline (click)="play17()">dā</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play18()">dá</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play19()">dǎ</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play20()">dà</button>
      </ion-col>
    </ion-row>
    <ion-row align-items-center>
      <ion-col>
        <button ion-button block outline (click)="play21()">tā</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play22()">tá</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play23()">tǎ</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play24()">tà</button>
      </ion-col>
    </ion-row>
    <ion-row align-items-center>
      <ion-col>
        <button ion-button block outline (click)="play25()">nā</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play26()">ná</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play27()">nǎ</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play28()">nà</button>
      </ion-col>
    </ion-row>
    <ion-row align-items-center>
      <ion-col>
        <button ion-button block outline (click)="play29()">lā</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play30()">lá</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play31()">lǎ</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play32()">là</button>
      </ion-col>
    </ion-row>
    <ion-row align-items-center>
      <ion-col>
        <button ion-button block outline (click)="play33()">gā</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play34()">gá</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play35()">gǎ</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play36()">gà</button>
      </ion-col>
    </ion-row>
    <ion-row align-items-center>
      <ion-col>
        <button ion-button block outline (click)="play37()">kā</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play38()">ká</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play39()">kǎ</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play40()">kà</button>
      </ion-col>
    </ion-row>
    <ion-row align-items-center>
      <ion-col>
        <button ion-button block outline (click)="play41()">hā</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play42()">há</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play43()">hǎ</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play43()">hà</button>
      </ion-col>
    </ion-row>
    <ion-row align-items-center>
      <ion-col>
        <button ion-button block outline (click)="play44()">zā</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play45()">zá</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play46()">zǎ</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play47()">zà</button>
      </ion-col>
    </ion-row>
    <ion-row align-items-center>
      <ion-col>
        <button ion-button block outline (click)="play48()">cā</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play50()">cá</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play51()">cǎ</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play52()">cà</button>
      </ion-col>
    </ion-row>
    <ion-row align-items-center>
      <ion-col>
        <button ion-button block outline (click)="play53()">pā</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play54()">pá</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play55()">pǎ</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play56()">pà</button>
      </ion-col>
    </ion-row>
    <ion-row align-items-center>
      <ion-col>
        <button ion-button block outline (click)="play57()">cā</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play59()">cá</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play60()">cǎ</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play61()">cà</button>
      </ion-col>
    </ion-row>
    <ion-row align-items-center>
      <ion-col>
        <button ion-button block outline (click)="play62()">cā</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play63()">cá</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play64()">cǎ</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play65()">cà</button>
      </ion-col>
    </ion-row>
    <ion-row align-items-center>
      <ion-col>
        <button ion-button block outline (click)="play66()">sā</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play67()">sá</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play68()">sǎ</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play69()">sà</button>
      </ion-col>
    </ion-row>
    <ion-row align-items-center>
      <ion-col>
        <button ion-button block outline (click)="play70()">zhā</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play71()">zhá</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play72()">zhǎ</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play73()">zhà</button>
      </ion-col>
    </ion-row>
    <ion-row align-items-center>
      <ion-col>
        <button ion-button block outline (click)="play74()">chā</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play75()">chá</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play76()">chǎ</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play77()">chà</button>
      </ion-col>
    </ion-row>
    <ion-row align-items-center>
      <ion-col>
        <button ion-button block outline (click)="play78()">shā</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play79()">shá</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play80()">shǎ</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play81()">shà</button>
      </ion-col>
    </ion-row>
    <ion-row align-items-center>
      <ion-col>
        <button ion-button block outline (click)="play82()">wā</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play83()">wá</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play84()">wǎ</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play85()">wà</button>
      </ion-col>
    </ion-row>
    <ion-row align-items-center>
      <ion-col>
        <button ion-button block outline (click)="play86()">yā</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play87()">yá</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play88()">yǎ</button>
      </ion-col>
      <ion-col>
        <button ion-button block outline (click)="play89()">yà</button>
      </ion-col>
    </ion-row>

Here it's still very big, but working:

this.platform.ready().then(() => {
  this.nativeAudio.preloadComplex('1', 'assets/audio/ba1.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('2', 'assets/audio/ba2.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('3', 'assets/audio/ba3.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('4', 'assets/audio/ba4.mp3', 1, 1, 0).then();

  this.nativeAudio.preloadComplex('5', 'assets/audio/pa1.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('6', 'assets/audio/pa2.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('7', 'assets/audio/pa3.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('8', 'assets/audio/pa4.mp3', 1, 1, 0).then();

  this.nativeAudio.preloadComplex('9', 'assets/audio/ma1.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('10', 'assets/audio/ma2.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('11', 'assets/audio/ma3.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('12', 'assets/audio/ma4.mp3', 1, 1, 0).then();

  this.nativeAudio.preloadComplex('13', 'assets/audio/fa1.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('14', 'assets/audio/fa2.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('15', 'assets/audio/fa3.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('16', 'assets/audio/fa4.mp3', 1, 1, 0).then();

  this.nativeAudio.preloadComplex('17', 'assets/audio/da1.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('18', 'assets/audio/da2.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('19', 'assets/audio/da3.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('20', 'assets/audio/da4.mp3', 1, 1, 0).then();

  this.nativeAudio.preloadComplex('21', 'assets/audio/ta1.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('22', 'assets/audio/ta2.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('23', 'assets/audio/ta3.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('24', 'assets/audio/ta4.mp3', 1, 1, 0).then();

  this.nativeAudio.preloadComplex('25', 'assets/audio/na1.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('26', 'assets/audio/na2.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('27', 'assets/audio/na3.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('28', 'assets/audio/na4.mp3', 1, 1, 0).then();

  this.nativeAudio.preloadComplex('29', 'assets/audio/la1.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('30', 'assets/audio/la2.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('31', 'assets/audio/la3.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('32', 'assets/audio/la4.mp3', 1, 1, 0).then();

  this.nativeAudio.preloadComplex('33', 'assets/audio/ga1.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('34', 'assets/audio/ga2.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('35', 'assets/audio/ga3.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('36', 'assets/audio/ga4.mp3', 1, 1, 0).then();

  this.nativeAudio.preloadComplex('37', 'assets/audio/ka1.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('38', 'assets/audio/ka2.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('39', 'assets/audio/ka3.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('40', 'assets/audio/ka4.mp3', 1, 1, 0).then();

  this.nativeAudio.preloadComplex('41', 'assets/audio/ha1.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('42', 'assets/audio/ha2.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('43', 'assets/audio/ha3.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('44', 'assets/audio/ha4.mp3', 1, 1, 0).then();

  this.nativeAudio.preloadComplex('45', 'assets/audio/za1.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('46', 'assets/audio/za2.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('47', 'assets/audio/za3.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('48', 'assets/audio/za4.mp3', 1, 1, 0).then();

  this.nativeAudio.preloadComplex('49', 'assets/audio/ca1.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('50', 'assets/audio/ca2.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('51', 'assets/audio/ca3.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('52', 'assets/audio/ca4.mp3', 1, 1, 0).then();

  this.nativeAudio.preloadComplex('53', 'assets/audio/sa1.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('54', 'assets/audio/sa2.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('55', 'assets/audio/sa3.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('56', 'assets/audio/sa4.mp3', 1, 1, 0).then();

  this.nativeAudio.preloadComplex('57', 'assets/audio/zha1.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('58', 'assets/audio/zha2.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('59', 'assets/audio/zha3.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('60', 'assets/audio/zha4.mp3', 1, 1, 0).then();

  this.nativeAudio.preloadComplex('61', 'assets/audio/cha1.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('62', 'assets/audio/cha2.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('63', 'assets/audio/cha3.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('64', 'assets/audio/cha4.mp3', 1, 1, 0).then();

  this.nativeAudio.preloadComplex('65', 'assets/audio/sha1.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('66', 'assets/audio/sha2.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('67', 'assets/audio/sha3.mp3', 1, 1, 0).then();
  this.nativeAudio.preloadComplex('68', 'assets/audio/sha4.mp3', 1, 1, 0).then();
});

}

play1 () {this.nativeAudio.play ('1'). then (); }   play2 () {this.nativeAudio.play ('2'). then (); }   play3 () {this.nativeAudio.play ('3'). then (); }   play4 () {this.nativeAudio.play ('4'). then (); }   play5 () {this.nativeAudio.play ('5'). then (); }   play6 () {this.nativeAudio.play ('6'). then (); }   play7 () {this.nativeAudio.play ('7'). then (); }   play8 () {this.nativeAudio.play ('8'). then (); }   play9 () {this.nativeAudio.play ('9'). then (); }   play10 () {this.nativeAudio.play ('10 '). then (); }   play11 () {this.nativeAudio.play ('11 '). then (); }   play12 () {this.nativeAudio.play ('12 '). then (); }   play13 () {this.nativeAudio.play ('13 '). then (); }   play14 () {this.nativeAudio.play ('14 '). then (); }   play15 () {this.nativeAudio.play ('15 '). then (); }   play16 () {this.nativeAudio.play ('16 '). then (); }   play17 () {this.nativeAudio.play ('17 '). then (); }   play18 () {this.nativeAudio.play ('18 '). then (); }   play19 () {this.nativeAudio.play ('19 '). then (); }   play20 () {this.nativeAudio.play ('20 '). then (); }   play21 () {this.nativeAudio.play ('21 '). then (); }   play22 () {this.nativeAudio.play ('22 '). then (); }   play23 () {this.nativeAudio.play ('23 '). then (); }   play24 () {this.nativeAudio.play ('24 '). then (); }   play25 () {this.nativeAudio.play ('25 '). then (); }   play26 () {this.nativeAudio.play ('26 '). then (); }   play27 () {this.nativeAudio.play ('27 '). then (); }   play28 () {this.nativeAudio.play ('28 '). then (); }   play29 () {this.nativeAudio.play ('29 '). then (); }   play30 () {this.nativeAudio.play ('30 '). then (); }   play31 () {this.nativeAudio.play ('31 '). then (); }   play32 () {this.nativeAudio.play ('32 '). then (); }   play33 () {this.nativeAudio.play ('33 '). then (); }   play34 () {this.nativeAudio.play ('34 '). then (); }   play35 () {this.nativeAudio.play ('35 '). then (); }   play36 () {this.nativeAudio.play ('36 '). then (); }   play37 () {this.nativeAudio.play ('37 '). then (); }   play38 () {this.nativeAudio.play ('38 '). then (); }   play39 () {this.nativeAudio.play ('39 '). then (); }   play40 () {this.nativeAudio.play ('40 '). then (); }   play41 () {this.nativeAudio.play ('41 '). then (); }   play42 () {this.nativeAudio.play ('42 '). then (); }   play43 () {this.nativeAudio.play ('43 '). then (); }   play44 () {this.nativeAudio.play ('44 '). then (); }   play45 () {this.nativeAudio.play ('45 '). then (); }   play46 () {this.nativeAudio.play ('46 '). then (); }   play47 () {this.nativeAudio.play ('47 '). then (); }   play48 () {this.nativeAudio.play ('48 '). then (); }   play49 () {this.nativeAudio.play ('49 '). then (); }   play50 () {this.nativeAudio.play ('50 '). then (); }   play51 () {this.nativeAudio.play ('51 '). then (); }   play52 () {this.nativeAudio.play ('52 '). then (); }   play53 () {this.nativeAudio.play ('53 '). then (); }   play54 () {this.nativeAudio.play ('54 '). then (); }   play55 () {this.nativeAudio.play ('55 '). then (); }   play56 () {this.nativeAudio.play ('56 '). then (); }   play57 () {this.nativeAudio.play ('57 '). then (); }   play58 () {this.nativeAudio.play ('58 '). then (); }   play59 () {this.nativeAudio.play ('59 '). then (); }   play60 () {this.nativeAudio.play ('60 '). then (); }   play61 () {this.nativeAudio.play ('61 '). then (); }   play62 () {this.nativeAudio.play ('62 '). then (); }   play63 () {this.nativeAudio.play ('63 '). then (); }   play64 () {this.nativeAudio.play ('64 '). then (); }   play65 () {this.nativeAudio.play ('65 '). then (); }   play66 () {this.nativeAudio.play ('66 '). then (); }   play67 () {this.nativeAudio.play ('67 '). then (); }   play68 () {this.nativeAudio.play ('68 '). then (); }   play69 () {this.nativeAudio.play ('69 '). then (); }   play70 () {this.nativeAudio.play ('70 '). then (); }   play71 () {this.nativeAudio.play ('71 '). then (); }   play72 () {this.nativeAudio.play ('72 '). then (); }   play73 () {this.nativeAudio.play ('73 '). then (); }   play74 () {this.nativeAudio.play ('74 '). then (); }   play75 () {this.nativeAudio.play ('75 '). then (); }   play76 () {this.nativeAudio.play ('76 '). then (); }   play77 () {this.nativeAudio.play ('77 '). then (); }   play78 () {this.nativeAudio.play ('78 '). then (); }   play79 () {this.nativeAudio.play ('79 '). then (); }   play80 () {this.nativeAudio.play ('80 '). then (); }   play81 () {this.nativeAudio.play ('81 '). then (); }   play82 () {this.nativeAudio.play ('82 '). then (); }   play83 () {this.nativeAudio.play ('83 '). then (); }   play84 () {this.nativeAudio.play ('84 '). then (); }   play85 () {this.nativeAudio.play ('85 '). then (); }   play86 () {this.nativeAudio.play ('86 '). then (); }   play87 () {this.nativeAudio.play ('87 '). then (); }   play88 () {this.nativeAudio.play ('88 '). then (); }   play89 () {this.nativeAudio.play ('89 '). then (); }