NgxSpeech

Voice recognition for Angular 5

Principle

NgxSpeech allows to trigger actions using voice commands.

The ngSpeechContext directive allows to define context. For instance, "menu" could be a context that will allow to activate the menu commands, and "search" another context enabling search commands.

Example:

<div [ngSpeechContext]="['pizza']">
  Say "pizza" and then choose your pizza
</div>

The ngSpeechAction directive allow to register a command into a context and bind it to method.

Example:

<li [ngSpeechActionContext]="['pizza']"
    [ngSpeechActionCommand]="'Napolitana'"
    [ngSpeechAction]="order">Napolitana</li>

will trigger the order() method if we say "Napolitana" only if we are in the "pizza" context (i.e. we said "pizza" before saying "Napolitana").

All the words corresponding to a command or a context are referenced in a grammar.

A command or a sub-context can be activcayed only if we are in the parent context, but a first-level context can activatyed from anywhere.

The SpeechService exposes useful observables:

• message, the last recognized word(s), even if it is not part of the current grammar,
• context, the current context as a path (like "menu/account"),
• command, the last comnmand.

Installation

npm install ngx-speech

Usage

In our app module, we need to import the SpeechModule and to provide the language to use:

@NgModule({
    ...
    imports: [
        ...
        SpeechModule,
    ],
    providers: [
        ...
        { provide: 'SPEECH_LANG', useValue: 'en-US' },
    ],
    ...
})
export class AppModule { }

To start the speech recognition, we ned to call the start() method:

import { SpeechService } from 'ngx-speech';

...

    constructor(public speech: SpeechService) { }

    ngOnInit() {
        this.speech.start();
    }