SpeechToTextButton Events

Updated on Nov 6, 2026

The Kendo UI for Angular SpeechToTextButton fires a number of events that allow you to respond to user interactions and speech recognition states.

Grant microphone access in the browser to try speech recognition in the following demo. The demo logs the events and the recognized text as you interact with the SpeechToTextButton.

Example

View Source

Loading ...

Available Events

The SpeechToTextButton fires the following events:

• start
• result
• end
• error

start

The start event is fired when the user clicks the SpeechToTextButton and the speech recognition process begins.

TS

public handleStart(): void {
    console.log('Speech recognition started');
}

result

The result event fires when a speech recognition result is available. It receives a SpeechToTextResultEvent with the following properties:

• isFinal—Indicates whether the result is final (true) or interim (false).
• alternatives—An array of recognition results. Each item contains a transcript string and a confidence score between 0 and 1.

With integrationMode set to none, the result event does not fire. The following snippet shows how to handle final and interim results.

TS

public handleResult(event: SpeechToTextResultEvent): void {
    if (event.alternatives && event.alternatives.length > 0) {
        const transcript = event.alternatives[0].transcript;
        const confidence = event.alternatives[0].confidence;
        if (event.isFinal) {
            // Handle final result
            this.finalText += transcript + ' ';
        } else {
            // Handle interim result
            this.interimText = transcript;
        }
    }
}

For more advanced usage with multiple alternatives and interim results, see SpeechToTextButton Configuration Options.

end

The end event fires when speech recognition stops. This can happen when:

• The user clicks the button again to stop listening OR
• The speech recognition system stops automatically after detecting silence.

The following snippet logs the end of recognition.

TS

public handleEnd(): void {
    console.log('Speech recognition stopped');
}

error

The error event fires when a speech recognition error occurs, including when microphone access is denied. It receives a SpeechToTextErrorEvent whose errorMessage string contains the error reported by the browser.

Common error values include:

• no-speech—No speech was detected.
• aborted—The recognition was aborted by the user or system.
• audio-capture—Audio capture failed, for example when no microphone is available.
• network—Network communication required for recognition failed.
• not-allowed—The user denied permission to use the microphone.
• service-not-allowed—The user denied permission to use the speech recognition service.
• bad-grammar—There was an error in the grammar or language model.
• language-not-supported—The specified language is not supported.

The following snippet handles specific error values.

TS

public handleError(event: SpeechToTextErrorEvent): void {
    switch (event.errorMessage) {
        case 'not-allowed':
            alert('Please allow microphone access to use speech recognition.');
            break;
        case 'no-speech':
            console.log('No speech detected.');
            break;
        case 'network':
            alert('Network error. Please check your connection.');
            break;
        default:
            console.error('Speech recognition error:', event.errorMessage);
    }
}

Suggested Links

• SpeechToTextButton API Reference
• SpeechToTextResultEvent API
• SpeechToTextButton Configuration Options
• SpeechToTextButton Integration
• SpeechToTextButton Appearance