Skip to main content

Angular device selection and effects

Use mediasfu-angular 2.4.1 services and room components for input selection, virtual backgrounds, and configured translation.

Select microphone or camera​

The supplied MediaSettingsModal connects device selection to the room. SwitchUserAudio and SwitchUserVideo are injectable services for custom controls. This example passes the selected device and the room parameter bag to the audio-switch service:

import {Injectable} from '@angular/core';
import {
SwitchUserAudio,
type SwitchUserAudioOptions,
} from 'mediasfu-angular';

@Injectable({providedIn: 'root'})
export class MicrophonePicker {
constructor(private readonly switchAudio: SwitchUserAudio) {}

select(deviceId: string, parameters: SwitchUserAudioOptions['parameters']) {
return this.switchAudio.switchUserAudio({
audioPreference: deviceId,
parameters,
});
}
}

Keep the parameter object tied to the active room. Handle permission denial and device removal in the UI, and report success only after the room has applied the switch.

Virtual backgrounds and translation​

Use the supplied BackgroundModal with LaunchBackground for the supported background flow. Translation surfaces include TranslationSettingsModal, LiveSubtitleService, TranslationConsumerSwitch, and TranslationReceiveMethods; they support rooms whose backend has enabled the feature and do not themselves configure a transcription provider.

Offer a no-effect option and preserve the regular camera path if processing fails. Language availability, caption display, translated audio, and transcript retention are separate product behaviors.

For Angular-specific lifecycle and recovery, see Angular room operations and Angular recovery.