Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
26 changes: 13 additions & 13 deletions angular/DropDownList/HowTo.md
Original file line number Diff line number Diff line change
@@ -1,15 +1,15 @@
---
layout: post
title: How to - DropDownList widget for Syncfusion Essential JS
description: How To Section in DropDownList widget for Syncfusion Essential JS
title: How to - DropDownList widget for Syncfusion Essential Angular
description: How To Section in DropDownList widget for Syncfusion Essential Angular, its elements, features, and more.
platform: angular
control: DropDownList
documentation: ug
keywords: DropDownList, dropdown, Adding Items, Set Focus, custommization
api: /api/js/ejdropdownlist
---

# How To
# How To Section in Angular DropDownList

## Set focus to control initially?

Expand Down Expand Up @@ -161,7 +161,7 @@ export class DropDownListComponent {

The following screenshot will exhibit the select event arguments details,

![](HowTo_images/HowTo_img1.jpeg)
![Angular DropDownList Retrieve the selected item data](HowTo_images/HowTo_img1.jpeg)

## Append custom HTML in DropDownList popup outside the scroller part?

Expand Down Expand Up @@ -298,9 +298,9 @@ export class DropDownListComponent {

The following screenshot exhibits the output of the above code,

![](HowTo_images/HowTo_img2.jpeg)
![Angular DropDownList Add check all option in popup list](HowTo_images/HowTo_img2.jpeg)

# To Cascade DropDownLists with different field names
## To Cascade DropDownLists with different field names
By default cascading is performed based on the Value field, so that it needs to be same with cascaded DropDownList. If you need to cascade 2 DropDownLists with different field names and same values in it, you can achieve it using cascadeQuery and [cascade](https://help.syncfusion.com/api/js/ejdropdownlist#events:cascade "") event. Define the cascade event for the DropDownList from which you need to filter the datasource for the other DropDownList.

In the cascade event arguments, modify the cascadeQuery which has the filtering query for the cascading DropDownList with your customized query. So to filter the datasource based on the different field names, pass an ej.Query() which want to execute for cascade DropDownList.
Expand Down Expand Up @@ -368,7 +368,7 @@ export class cascadeToComponent {

{% endhighlight %}

![](HowTo_images/HowTo_img3.png)
![Angular DropDownList To Cascade DropDownLists with different field names](HowTo_images/HowTo_img3.png)

## To reorder the selected items and assign it to the top of popup list
Consider a DropDownList enabled with Virtual Scrolling, Filter search and Checkbox. This allows you to search through the list items and select multiple items. Selected items will be maintained in the DropDownList textbox but randomly shown in the pop up.
Expand Down Expand Up @@ -714,10 +714,10 @@ export class DropDownListComponent {
The following screenshot exhibits the output of above code:

Before removing an item:
![](HowTo_images/Image1.JPG)
![Angular DropDownList Before removing an item](HowTo_images/Image1.JPG)

After removing an item:
![](HowTo_images/Image2.JPG)
![Angular DropDownList After removing an item](HowTo_images/Image2.JPG)


## Select the image rather than the text from the DropDownList when the template concept is used?
Expand Down Expand Up @@ -807,7 +807,7 @@ Apply the following styles

{% endhighlight %}

![](HowTo_images/customValue.png)
![Angular DropDownList customValue](HowTo_images/customValue.png)

N> This scenarios, will be suits for the single select mode in the DropDownList.

Expand Down Expand Up @@ -867,7 +867,7 @@ export class DropDownListComponent {

{% endhighlight %}

![](HowTo_images/htmlAttr.png)
![Angular DropDownList htmlAttr](HowTo_images/htmlAttr.png)

## Add tooltip on hovering the DropDownList’s items?

Expand Down Expand Up @@ -1086,7 +1086,7 @@ export class DropdownlistComponent {

{% endhighlight %}

![](HowTo_images/Json1.png)
![Angular DropDownList JSON data source](HowTo_images/Json1.png)

Method 2: Using Visual Mode

Expand Down Expand Up @@ -1134,4 +1134,4 @@ export class DropdownlistComponent {

{% endhighlight %}

![](HowTo_images/Json2.png)
![Angular DropDownList Json](HowTo_images/Json2.png)
8 changes: 4 additions & 4 deletions angular/Maps/Public-Methods-and-Events.md
Original file line number Diff line number Diff line change
@@ -1,16 +1,16 @@
---
layout: post
title: Syncfusion EJ1 Maps - Public Methods and Events
description: Public Methods and Events
title: Public Methods and Events in Angular Maps Control | Syncfusion
description: Learn here about Public Methods and Events in Syncfusion Essential Angular Maps Control, its elements, and more.
platform: Angular
control: Maps
documentation: ug
---


## Methods
# Public Methods and Events in Angular Maps

### navigateTo(latitude, longitude, level)
## navigateTo(latitude, longitude, level)


Method for navigating to specific shape based on latitude, longitude and zoom level.
Expand Down
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified angular/Rotator/display settings_images/framespace_img1.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
18 changes: 9 additions & 9 deletions angular/Rotator/display-settings.md
Original file line number Diff line number Diff line change
@@ -1,15 +1,15 @@
---
layout: post
title: display settings
description: display settings
title: Display settings in Angular Rotator Control | Syncfusion
description: Learn here about display settings support in Syncfusion Essential Angular Rotator Control, its elements, and more.
platform: Angular
control: rotator
documentation: ug
---

## Display settings
# Display settings in Angular Rotator

### Display Items count
## Display Items count

This property specifies the number of Rotator Items to be displayed. The default value is ‘1’. The value set to this property is string or number.

Expand Down Expand Up @@ -68,7 +68,7 @@ This property specifies the number of Rotator Items to be displayed. The defau
{% endhighlight %}


![](display settings_images\displayitemscount_img1.png)
![Angular Rotator displayitemscount](display settings_images\displayitemscount_img1.png)

### Navigation steps

Expand Down Expand Up @@ -109,7 +109,7 @@ This property specifies the number of Rotator Items to navigate on a single



![](display settings_images\navigationsteps_img1.png)
![Angular Rotator navigationsteps](display settings_images\navigationsteps_img1.png)

### Set Starting index

Expand Down Expand Up @@ -150,7 +150,7 @@ This property **startIndex** sets the index of the slide that is displayed fir



![](display settings_images\setstartingindex_img1.png)
![Angular Rotator setstartingindex](display settings_images\setstartingindex_img1.png)

### Frame space

Expand Down Expand Up @@ -191,7 +191,7 @@ This **frameSpace** property sets the space between the Rotator Items. The val



![](display settings_images\framespace_img1.png)
![Angular Rotator framespace](display settings_images\framespace_img1.png)

### Animation settings

Expand Down Expand Up @@ -474,7 +474,7 @@ This feature allows you to add text along with the image in Rotator component



![](display settings_images\imagewithcontents_img1.png)
![Angular Rotator imagewithcontents](display settings_images\imagewithcontents_img1.png)



Expand Down