[2020-02-07] components and templates - user input

User input

When the user clicks the link, press the button or input text, these user actions will generate DOM events.

This chapter explains how to use the event binding syntax Angular these events to the event handler

Bound to user input events

 

 Get user input by $ event objects

DOM events can carry potentially useful information for components

 

 Incoming $ event is deceptive practices:

Type of event object exposes the important point, that is opposed to the whole DOM event passed to the method, because this assembly will know that too much information template. Only when it should not have to know more to know HTML implementation details, it can extract information. This violates the separation between the templates and components (application how to handle user data) (user sees) concern principle

The following describes how to reference the variable template to solve this problem

Get user input from a reference template variable

 These templates reference variables provides the ability to access elements directly from the module. Before identifier plus (#) will be able to declare a variable reference template

 

 Press event filtering (by key.enyer)

Each time (keyup) event handler to listen button. Sometimes only care about the Enter key, because it marks the end user input.

One way to solve this problem is to check each $ event.keyCode, the key is to take action only when the Enter key

The method is simpler for: bound to keyup.enter simulation of the event Angular. And then only when the user hit the Enter key, Angular event handler will be called

Event loses focus (blur)

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

method

Guess you like

Origin www.cnblogs.com/QQ-lala/p/12272982.html