Data Binding in Angular

 

3. What is data binding? Which type of data binding does Angular deploy?

Data binding is a phenomenon that allows any internet user to work with dynamic data. It uses dynamic HTML and makes use of simple scripting. We use data binding in web pages that contain interactive components such as forms, calculators, tutorials, and games. When a page has lots of data, incremental display of data becomes more important from performance point of view.

Angular uses the two-way binding. Any changes made to the user interface are reflected in the corresponding model state. Conversely, any changes in the model state are reflected in the UI state. This allows the framework to connect the DOM to the Model data via the controller. However, this approach affects performance since every change in the DOM has to be tracked

Example

<app-sizer [(size)]="fontSizePx"></app-sizer>

For two-way data binding to work, the @Output() property must use the pattern, <input>Change, where input is the name of the @Input() property. For example, if the @Input() property is size, the @Output() property must be sizeChange.
The following sizerComponent has a size value property and a sizeChange event. The size property is an @Input(), so data can flow into the sizerComponent. The sizeChange event is an @Output(), which lets data flow out of the sizerComponent to the parent component

 

Next, there are two methods, dec() to decrease the font size and inc() to increase the font size. These two methods use resize() to change the value of the size property within min/max value constraints, and to emit an event that conveys the new size value

export class SizerComponent { @Input() size!: number | string; @Output() sizeChange = new EventEmitter<number>(); dec() { this.resize(-1); } inc() { this.resize(+1); } resize(delta: number) { this.size = Math.min(40, Math.max(8, +this.size + delta)); this.sizeChange.emit(this.size); } }

Comments

Post a Comment

Popular posts from this blog

Hibernate Many to Many Relationship

  @Entity @Table(name = "Employee") public class Employee { // ... @ManyToMany(cascade = { CascadeType.ALL }) @JoinTable( name = "Employee_Project", joinColumns = { @JoinColumn(name = "employee_id") }, inverseJoinColumns = { @JoinColumn(name = "project_id") } ) Set<Project> projects = new HashSet <>(); // standard constructor/getters/setters } @JoinTable specifies that an intermediate table is used to map the ManyToMany relationship it specifies the Join column as the id of the Employee class from which the Many side of the relationship is being created. The inverseJoinColumns attribute specifies the Join column of the target of the M2M relationship. @Entity @Table(name = "Project") public class Project { // ... @ManyToMany(mappedBy = "projects") private Set<Employee> employees = new HashSet <>(); // ...
Read more

Why Integral Calculus limit tending to infinity a sacrilege

I think that, Integral calculus tending to infinity should be discontinued in the sense of the thing that space and time are infinite and calculating the area under the entire curve is a crime.. Differntial calculus also to the limit of 0 should not be taught.. Though I feel 0 and infinity are scary concepts which may help in extending your thought, but is a big farce.. limited thought and a mix of good/bad feeling is what should be the new norm.. the distribution of the elements in space has to continue expanding and there's plenty of space available for the good souls and also on earth people should reduce the burden by living a decent baalanced life no matter if you are good or evil.. And As a schizophrenic I am looking for my medicinal cure F-20.. please excuse
Read more

Introduction

Introduction My Mother Usha Wangnoo Sharma My Father Prof.. MK Sharma My Brother Kunal Sharma young generation As a kid I was not aware about what I was studying, In fact I don't even remember me studying A,B,C at school.. I caught up with the basics in class 6 th and Then I studied grammer thorroughly. THen I don't know why I started studying science and I started enjoying enjoyed it, along with History, Geography(was my favourite area of choice) Chemistry was my second area of interest,But I think Biology was a favourite also I could draw Birds and their internal organisms very clearly, was scared to cut lizzards in the zoology class in the bio Lab. I was well aware of the human body structure but I skipped the Genital organs class due to some strange consciousness and I was ashamed. I got deep into science and used to revisit the language(English) was very weak in Sanskrit and Hindi. That's half the problem. I was often called ulti khopdi by my classmates.. In f...
Read more