Sender
Import |
Source |
Docs |
When To Use#
Need to build an input box for a dialogue scenario.
Examples #
Loading...
Loading...
Loading...
Loading...
Loading...
`Shift + Enter` to submit
Loading...
Loading...
Loading...
Loading...
API#
nx-sender#
| Property | Description | Type | Default |
|---|---|---|---|
[ngModel] | Input value, supports two-way binding | string | - |
[nxDisabled] | Whether the input is disabled | boolean | false |
[nxLoading] | Whether it is loading | boolean | false |
[nxValue] | Input value | string | - |
[nxPlaceholder] | Placeholder text for the input | string | - |
[nxReadonly] | Whether the input is read-only | boolean | false |
[nxSubmitType] | Keyboard submit mode, can be Enter or Shift+Enter | 'enter' | 'shiftEnter' | 'enter' |
[nxAllowSpeech] | Whether to allow speech input | boolean | NxSpeechConfig | false |
[nxActions] | Customize operation buttons. When no built-in button is needed, set null | TemplateRef | null | - |
[nxHeader] | Header content | TemplateRef | - |
[nxFooter] | Footer content | TemplateRef | - |
(nxSubmit) | Callback when the send button is clicked | EventEmitter<void> | - |
(nxCancel) | Callback when the cancel button is clicked | EventEmitter<void> | - |
(nxChange) | Callback when the input value changes | EventEmitter<string> | - |
[nx-sender-prefix]#
Use the nx-sender-prefix directive to customize prefix content.
[nx-sender-extend-action]#
Customize additional action buttons using the nx-sender-extend-action directive, which will be used in combination with built-in action buttons.
Here, 'nxActions' cannot be set to null, otherwise no action buttons will be displayed !
Interfaces#
interface NxSpeechConfig {
// When setting `recording`, the built-in speech input function will be disabled.
// It is up to the developer to implement the third-party speech input function.
recording?: boolean;
onRecordingChange?: (recording: boolean) => void;
}