I can not call the IONIC 3 function

I'm having trouble calling a page to make a calculation, can anyone help me please?

home.html

<ion-header>
  <ion-navbar>
    <ion-title> Fuel Calculator</ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>
   <div class="body">      

      <ion-item>
        <ion-label stacked>Consumo do Veículo </ion-label>
        <ion-input [(ngModel)] ="c" type="double"></ion-input>
      </ion-item>

      <ion-item>
        <ion-label stacked>Distancia Percorrida</ion-label>
        <ion-input [(ngModel)] ="d" type="double"></ion-input>
      </ion-item>

      <ion-item>
        <ion-label stacked>Preço do Combustível</ion-label>
        <ion-input [(ngModel)] ="p" type="double"></ion-input>
       </ion-item>

       <button ion-button block color="white" class="btn-calcular" (click)="calculo()">
          Calcular
        </button>

    </div>            
</ion-content>

home.ts

import { CalculoPage } from './../calculo/calculo';
import { Component } from '@angular/core';
import { NavController, ToastController } from 'ionic-angular';
@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})

export class HomePage {
  constructor(public navCtrl: NavController) {
  }

  calculo(){
    this.navCtrl.push(CalculoPage);
  }
}

calculo.ts

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';

@Component({
  selector: 'page-calculo',
  templateUrl: 'calculo.html',
})

export class CalculoPage {

  constructor(public navCtrl: NavController, 
              public navParams: NavParams) {
  }

  calcCombustivel(d: number, cv:number): number{
    let divisao:number = d/cv;
    return divisao;
  }

  ionViewDidLoad() {
    console.log('ionViewDidLoad CalculoPage');
  }
}