In this short chapter we will show you simple example of Aurelia refs. We can use it to create a reference to a particular object. We can create a reference to elements or attributes, as seen in the following table.
Reference Table
Example | Description |
---|---|
ref="myRef" | Used for creating a reference to DOM element. |
attribute-name.ref="myRef" | Used for creating a reference to custom attribute's view-model. |
view-model.ref="myRef | Used for creating a reference to custom element's view-model. |
view.ref="myRef" | Used for creating a reference to custom elements view instance. |
rcontroller.ref="myRef" | Used for creating a reference to custom element's controller instance. |
In our example we will show you how to create a reference to input element. We will use default class syntax as a view-model.
app.js
export class App { }
We are creating a reference to input element by adding ref="name"attribute.
app.html
<template> <input type = "text" ref = "name"><br/> <h3>${name.value}</h3> </template>
When we run the app, we will see that the text entered into input field is rendered on screen.
Tidak ada komentar:
Posting Komentar