# Target

The `target` input of the ContextMenu defines the item for which the component will open.

## Configuration

You can set [`target`](https://www.telerik.com/kendo-angular-ui/components/menus/api/contextmenucomponent#target) to any of the following values:

* A DOM element reference.
* A CSS selector string that matches the target element.
* An [`ElementRef`](https://angular.dev/api/core/ElementRef) class.
* A [`kendoContextMenuTargetContainer`](https://www.telerik.com/kendo-angular-ui/components/menus/api/contextmenutargetcontainerdirective) directive instance.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/menus/context-menu/target/source.txt)

## Filtering the Targets

You can filter the targets within a container for which the ContextMenu will open.

1. Set the [`target`](https://www.telerik.com/kendo-angular-ui/components/menus/api/contextmenucomponent#target) input to the container element.
2. Set the [`filter`](https://www.telerik.com/kendo-angular-ui/components/menus/api/contextmenucomponent#filter) property to a CSS selector which matches the elements for which the ContextMenu will open.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/menus/context-menu/filter/source.txt)

## Changing Items for Specific Targets

Depending on the filtered target elements, you can change the items that are shown in the ContextMenu by using the [`popupOpen`](https://www.telerik.com/kendo-angular-ui/components/menus/api/contextmenucomponent#popupopen) event.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/menus/context-menu/target-items/source.txt)

## Directives

The ContextMenu allows you to associate its target elements with data by using its [`kendoContextMenuTargetContainer`](https://www.telerik.com/kendo-angular-ui/components/menus/api/contextmenutargetcontainerdirective) and [`kendoContextMenuTarget`](https://www.telerik.com/kendo-angular-ui/components/menus/api/contextmenutargetdirective) directives.

1. Set `kendoContextMenuTargetContainer` to the `root` element.
2. Pass the directive to the [`target`](https://www.telerik.com/kendo-angular-ui/components/menus/api/contextmenucomponent#target) input of the ContextMenu.

> You have to set the `kendoContextMenuTarget` directives to the specific elements within the container for which the ContextMenu will open.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/menus/context-menu/target-directives/source.txt)

## Suggested Links

* [API Reference of the ContextMenu component](https://www.telerik.com/kendo-angular-ui/components/menus/api/contextmenucomponent)