在你的ionic项目里如何应用语音识别？

复制

• 复制huatong.png到项目的src/assets/images/目录下；
• 复制cmb-crm-ai的npm包到项目的node-modules目录下；

模块改动

xxxx.module.ts中加载cmb-crm-ai组件

import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { xxxxPage } from './xxxx';

// Import your module
import { CmbCrmAiModule } from "cmb-crm-ai";
@NgModule( {
  declarations: [
	xxxxPage,
  ],
  imports: [
    IonicPageModule.forChild( xxxxPage ),
    CmbCrmAiModule,
  ],
} )
export class xxxxPageModule { }

xxxx.ts中添加识别后的处理函数

import { ChangeDetectorRef, Component, EventEmitter, ViewChild } from '@angular/core';
import { AudioComponent } from "cmb-crm-ai";
@IonicPage( {
  name: 'xxxx',
} )
@Component( {
  selector: 'page-xxxx',
  templateUrl: 'xxxx.html',
} )
export class LogWritePage {
  @ViewChild( 'audioai' ) public audioAi: AudioComponent;
  public audioPrcCode = 'ALOGCALLASRREST'; //api地址
  public audioPath = PATHS.WORK_LOG_PATH; //api路径
  constructor(public ref: ChangeDetectorRef){
  }
  public changeText( audioText: string) {
    if ( audioText !== "" ) {
      this.content += audioText;
    } else {
      //自己处理一下识别失败的情况
    }
    this.ref.markForCheck(); // TODO   这里必须要做这样极客的事情页面才会有反应
    this.ref.detectChanges();
  }

xxxx.html中添加语音识别入口组件

<audio-ai #audioai [prcCode]="audioPrcCode" [path]="audioPath" (audioText)="changeText($event)"></audio-ai>