Meaning of this in JS depends on the scope. See here for more info. You could either bind this to the callback or make it an arrow function.

Try the following

Option 1: bind this

ngAfterViewInit() {
  const gesture: Gesture = this.gestureCtrl.create({
    el: this.transCanvasElement,
    gestureName: 'rotate',
    onStart: ev => this.onStartHandler(ev).bind(this)  // <-- bind `this` to the callback
  }, true);
  gesture.enable();
}

onStartHandler(ev) {
  console.log('ionic gesture ev angle: ', ev.rotation);
}

Option 2: arrow function

ngAfterViewInit() {
  const gesture: Gesture = this.gestureCtrl.create({
    el: this.transCanvasElement,
    gestureName: 'rotate',
    onStart: ev => this.onStartHandler(ev)
  }, true);
  gesture.enable();
}

onStartHandler = (ev) => {                           // <-- arrow function
  console.log('ionic gesture ev angle: ', ev.rotation);
}

Meaning of this in JS depends on the scope. See here for more info. You could either bind this to the callback or make it an arrow function.

Try the following

Option 1: bind this

ngAfterViewInit() {
  const gesture: Gesture = this.gestureCtrl.create({
    el: this.transCanvasElement,
    gestureName: 'rotate',
    onStart: this.onStartHandler.bind(this)  // <-- bind `this` to the callback
  }, true);
  gesture.enable();
}

onStartHandler(ev) {
  console.log('ionic gesture ev angle: ', ev.rotation);
}

Option 2: arrow function

ngAfterViewInit() {
  const gesture: Gesture = this.gestureCtrl.create({
    el: this.transCanvasElement,
    gestureName: 'rotate',
    onStart: ev => this.onStartHandler(ev)
  }, true);
  gesture.enable();
}

onStartHandler = (ev) => {                           // <-- arrow function
  console.log('ionic gesture ev angle: ', ev.rotation);
}