Skip to content

Small readme rework #364

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 4 commits into from
Jan 27, 2017
Merged

Small readme rework #364

Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
c833e52
Specify an examples for string and non-string options
Aden-git Jan 27, 2017
f94321c
Remove version parameter from links to DevEextreme documentation
Aden-git Jan 27, 2017
31c87bd
Revert anchors
Aden-git Jan 27, 2017
5e8872f
Merge branch 'master' into Readme_rework
Aden-git Jan 27, 2017
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
25 changes: 18 additions & 7 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,8 @@ This project allows you to use [DevExtreme Widgets](http://js.devexpress.com/Dem
* [Starting a new application](#create-application)
* [Running the local examples](#running-examples)
* [Usage samples](#usage-samples)
* [Static option value](#static-option)
* [Static string option value](#static-option)
* [Static non-string option value](#static-non-string-option)
* [Event handling](#event-handling)
* [One-way option binding](#one-way-binding)
* [Two-way option binding](#two-way-binding)
Expand Down Expand Up @@ -133,19 +134,29 @@ Navigate to [http://127.0.0.1:8875/examples/](http://127.0.0.1:8875/examples/) i

## <a name="usage-samples"></a>Usage Samples ##

### <a name="static-option"></a>Static Option Value ###
### <a name="static-option"></a>Static String Option Value ###

To specify a string widget's option statically
(the [text](http://js.devexpress.com/Documentation/ApiReference/UI_Widgets/dxButton/Configuration/?version=15_2#text)
(the [text](http://js.devexpress.com/Documentation/ApiReference/UI_Widgets/dxButton/Configuration/#text)
option of dxButton):

```html
<dx-button text="Simple button"></dx-button>
```

### <a name="static-non-string-option"></a>Static Non-string Option Value ###

To specify a non-string widget's option statically
(the [disabled](http://js.devexpress.com/Documentation/ApiReference/UI_Widgets/dxButton/Configuration/#disabled)
option of dxButton):

```html
<dx-button [disabled]="false"></dx-button>
```

### <a name="event-handling"></a>Event Handling ###

To bind the dxButton’s [click](http://js.devexpress.com/Documentation/ApiReference/UI_Widgets/dxButton/Events/?version=15_2#click) event:
To bind the dxButton’s [click](http://js.devexpress.com/Documentation/ApiReference/UI_Widgets/dxButton/Events/#click) event:

```html
<dx-button (onClick)="handler()"></dx-button>
Expand All @@ -154,7 +165,7 @@ To bind the dxButton’s [click](http://js.devexpress.com/Documentation/ApiRefer
### <a name="one-way-binding"></a>One-way Option Binding ###

If we want changes to the value of ‘bindingProperty’ of the host component to propagate to the
[value](http://js.devexpress.com/Documentation/ApiReference/UI_Widgets/dxTextBox/Configuration/?version=15_2#value) of the dxTextBox widget,
[value](http://js.devexpress.com/Documentation/ApiReference/UI_Widgets/dxTextBox/Configuration/#value) of the dxTextBox widget,
a one-way binding approach is used:

```html
Expand All @@ -173,8 +184,8 @@ or vice versa from the widget to the bindingProperty:
### <a name="custom-templates"></a>Custom Templates ###

In case you want to customize the rendering of a DevExtreme widget, we support custom templates. For instance, we can specify
the [itemTemplate](http://js.devexpress.com/Documentation/ApiReference/UI_Widgets/dxList/Configuration/?version=15_2#itemTemplate)
and [groupTemplate](http://js.devexpress.com/Documentation/ApiReference/UI_Widgets/dxList/Configuration/?version=15_2#groupTemplate)
the [itemTemplate](http://js.devexpress.com/Documentation/ApiReference/UI_Widgets/dxList/Configuration/#itemTemplate)
and [groupTemplate](http://js.devexpress.com/Documentation/ApiReference/UI_Widgets/dxList/Configuration/#groupTemplate)
of the dxList widget as follows:

```html
Expand Down