| OLD | NEW |
| 1 --- | 1 --- |
| 2 layout: default | 2 layout: default |
| 3 title: "Target 8: Define a Custom DOM Tag" | 3 title: "Target 8: Define a Custom DOM Tag" |
| 4 description: "Define a custom DOM element tag with help from the Web UI package" | 4 description: "Define a custom DOM element tag with help from the Web UI package" |
| 5 has-permalinks: true | 5 has-permalinks: true |
| 6 tutorial: | 6 tutorial: |
| 7 id: web-components | 7 id: web-components |
| 8 next: fetchdata |
| 9 next-title: "Fetch Data Dynamically" |
| 10 prev: templates |
| 11 prev-title: "Use <template>" |
| 8 --- | 12 --- |
| 9 | 13 |
| 10 {% capture whats_the_point %} | 14 {% capture whats_the_point %} |
| 11 | 15 |
| 12 * Make your own DOM element tags with the <element> tag. | 16 * Make your own DOM element tags with the <element> tag. |
| 13 * A custom element requires a template and can have a script. | 17 * A custom element requires a template and can have a script. |
| 14 * Use data binding to connect Dart variables to content. | 18 * Use data binding to connect Dart variables to content. |
| 15 * Directly attach event handlers in HTML. | 19 * Directly attach event handlers in HTML. |
| 16 | 20 |
| 17 {% endcapture %} | 21 {% endcapture %} |
| (...skipping 377 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 395 and the corresponding source code. | 399 and the corresponding source code. |
| 396 </li> | 400 </li> |
| 397 <li> | 401 <li> |
| 398 The Web UI package contains several examples, | 402 The Web UI package contains several examples, |
| 399 including a version of | 403 including a version of |
| 400 <a href="https://github.com/dart-lang/web-ui/tree/master/example/todomvc" | 404 <a href="https://github.com/dart-lang/web-ui/tree/master/example/todomvc" |
| 401 target="_blank">TodoMVC</a>. | 405 target="_blank">TodoMVC</a>. |
| 402 </li> | 406 </li> |
| 403 </ul> | 407 </ul> |
| 404 | 408 |
| 405 <hr> | |
| 406 | |
| 407 <div class="row"> | |
| 408 <div class="span3"> | |
| 409 <a href="/docs/tutorials/templates/"><i class="icon-chevron-left"> </i> Use &l
t;template></a> | |
| 410 </div> | |
| 411 <div class="span3"> | |
| 412 <a href="http://code.google.com/p/dart/issues/entry?template=Tutorial%20feedback
" | |
| 413 target="_blank"> | |
| 414 <i class="icon-comment"> </i> | |
| 415 Send feedback | |
| 416 </a> | |
| 417 </div> | |
| 418 <div class="span3"> | |
| 419 <a href="/docs/tutorials/fetchdata/" class="pull-right">Fetch Data Dynamically
<i class="icon-chevron-right"> </i> </a> | |
| 420 </div> | |
| 421 </div> | |
| 422 | |
| 423 {% endcapture %} | 409 {% endcapture %} |
| 424 | 410 |
| 425 {% include tutorial.html %} | 411 {% include tutorial.html %} |
| OLD | NEW |