# Custom Values

To configure the MultiSelect to accept custom values, set the [`allowCustom`](https://www.telerik.com/kendo-angular-ui/components/dropdowns/api/multiselectcomponent#allowcustom) property to `true`.

## Primitive Values

If the component is bound to primitive values (strings, numbers, or other), set the [`allowCustom`](https://www.telerik.com/kendo-angular-ui/components/dropdowns/api/multiselectcomponent#allowcustom) property to `true`.

> This approach is valid when the component is either bound to a dataset of primitive (strings, numbers, or other) or complex values (objects), and the `valuePrimitive` property is set to `true`.

The following example demonstrates how to allow custom primitive values:

* Each value of the MultiSelect is unique and can be selected once. If the typed custom value matches an item from the list, the component will select it on `Enter`. If the typed value matches an already selected item, the component will deselect that value and remove the corresponding tag.
* The default matching logic is case-insensitive.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/dropdowns/multiselect/custom_values/source.txt)

To customize the built-in matching logic and deselecting behavior of the tags, use the [`valueNormalizer`](https://www.telerik.com/kendo-angular-ui/components/dropdowns/api/multiselectcomponent#valuenormalizer) property. You can persist the selected tag on its consecutive selection, if the `valueNormalizer` returns `null`. For example, if the user types in `small`, the MultiSelect will select the **Small** item from its item list on `Enter`. If the user types in `small` again, the MultiSelect will not remove the already selected **Small** tag on `Enter`.

The following example demonstrates how to apply the custom deselecting behavior of the tags.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/dropdowns/multiselect/custom_values/deselecting_behavior/source.txt)

## Complex Values

If the component is bound to objects, set the [`allowCustom`](https://www.telerik.com/kendo-angular-ui/components/dropdowns/api/multiselectcomponent#allowcustom) property to `true` and provide a [`valueNormalizer`](https://www.telerik.com/kendo-angular-ui/components/dropdowns/api/multiselectcomponent#valuenormalizer) function. The purpose of the `valueNormalizer` function is to convert the user text input into an object that can be recognized as a valid MultiSelect value.

> The `valueNormalizer` function receives `Observable<string>` as an argument and is expected to return a single normalized value that is wrapped as [`Observable`](http://reactivex.io/rxjs/manual/overview.html#introduction), which will be further processed by the component.

The following example demonstrates how to allow custom object values.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/dropdowns/multiselect/custom_values/object_values/source.txt)

### Using with a Remote Service

The following example demonstrates how to handle custom object values through a remote service.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/dropdowns/multiselect/remote_normalizer/source.txt)

### Handling Errors

The following example demonstrates how to handle errors that occur while normalizing custom object values through a remote service.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/dropdowns/multiselect/remote_normalizer_error/source.txt)

## Suggested Links

* [API Reference of the MultiSelect](https://www.telerik.com/kendo-angular-ui/components/dropdowns/api/multiselectcomponent)