Property binding is the primary way of binding data in Angular. The square braces are used to bind data to a property of an element, the trick is to put the property onto the element wrapped in brackets: [property] .
Usage
- This tag is intended for questions which ask about Angular Property Binding
Code Sample
Let's consider an example where we are binding the value property of the input element to a component's myText property.
import { Component } from "@angular/core";
@Component({
selector: 'app-example',
template: `
<div>
<h3 [value]='myText'></h3>
</div>
`
})
export class AppComponent {
myText: string = "Hello World";
}
Result:
Hello World
Asking a question
- Mention you want to update/bind DOM elements to property in compoent.
- Reduce your issue to a small example
- Post a reduced working code on plnkr.co or stackblitz.com
- If there's a bug (or some unintentional behavior), try to troubleshoot the problem. (If it's a bug report, please create a new issue at Angular's Github repository instead.)
Learn more
To learn more about Angular Material, visit the following resources to help you get started: