ApiAIPromises is not defined in ionic 3 dialogflow


#1

I’m using dialogflow in my ionic app. This is my .ts file.

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

declare var ApiAIPromises: any;

@IonicPage()
@Component({
  selector: 'page-chat-box',
  templateUrl: 'chat-box.html',
})
export class ChatBoxPage {

  answer;

  constructor(public navCtrl: NavController,
      public navParams: NavParams,
      public ngZone: NgZone) 
      {
        ApiAIPromises.init({
        clientAccessToken: "xxxxxxxxxxxx"
      })
      .then((result) =>  console.log(result))

  }

  ionViewDidLoad() {
    console.log('ionViewDidLoad ChatBoxPage');
  }
  goBack() {
    this.navCtrl.pop();
  }

  ask(question) {
    ApiAIPromises.requestText({
      query: question
    })
    .then(({result: {fulfillment: {speech}}}) => {
       this.ngZone.run(()=> {
         this.answer = speech;
       });
    })
  }

}

I’ve also installed the plugin

ionic cordova plugin add cordova-plugin-apiai
When i’m trying to run it I’m getting an error as mentioned below.

Uncaught (in promise): ReferenceError: ApiAIPromises is not defined
ReferenceError: ApiAIPromises is not defined
at new ChatBoxPage (chat-box.ts:19)
at createClass (core.js:12443)
at createDirectiveInstance (core.js:12284)
at createViewNodes (core.js:13742)
at createRootView (core.js:13631)
at callWithDebugContext (core.js:15056)
at Object.debugCreateRootView [as createRootView] (core.js:14339)
at ComponentFactory_.create (core.js:11236)
at ComponentFactoryBoundToModule.create (core.js:4023)
at Tab.NavControllerBase.viewInit (nav-controller-base.js:441)
at new ChatBoxPage (chat-box.ts:19)
at createClass (core.js:12443)
at createDirectiveInstance (core.js:12284)
at createViewNodes (core.js:13742)
at createRootView (core.js:13631)
at callWithDebugContext (core.js:15056)
at Object.debugCreateRootView [as createRootView] (core.js:14339)
at ComponentFactory
.create (core.js:11236)
at ComponentFactoryBoundToModule.create (core.js:4023)
at Tab.NavControllerBase._viewInit (nav-controller-base.js:441)
at c (polyfills.js:3)
at Object.reject (polyfills.js:3)
at Tab.NavControllerBase._fireError (nav-controller-base.js:223)
at Tab.NavControllerBase._failed (nav-controller-base.js:216)
at nav-controller-base.js:263
at t.invoke (polyfills.js:3)
at Object.onInvoke (core.js:4749)
at t.invoke (polyfills.js:3)
at r.run (polyfills.js:3)
at polyfills.js:3
defaultErrorLogger @ core.js:1448
ErrorHandler.handleError @ core.js:1509
IonicErrorHandler.handleError @ ionic-error-handler.js:61
next @ core.js:5497
schedulerFn @ core.js:4331
SafeSubscriber.__tryOrUnsub @ Subscriber.js:239
SafeSubscriber.next @ Subscriber.js:186
Subscriber._next @ Subscriber.js:126
Subscriber.next @ Subscriber.js:90
Subject.next @ Subject.js:55
EventEmitter.emit @ core.js:4311
(anonymous) @ core.js:4771
t.invoke @ polyfills.js:3
r.run @ polyfills.js:3
NgZone.runOutsideAngular @ core.js:4697
onHandleError @ core.js:4771
t.handleError @ polyfills.js:3
r.runGuarded @ polyfills.js:3
(anonymous) @ polyfills.js:3
n.microtaskDrainDone @ polyfills.js:3
o @ polyfills.js:3
e.invokeTask @ polyfills.js:3
p @ polyfills.js:2
v @ polyfills.js:2


#2

Try running the app on an actual device.