docs: add section on binding to passive events (#42292)
fixes #41622 PR Close #42292
This commit is contained in:
parent
de8a6ae9ed
commit
bd51762d6e
|
@ -24,6 +24,26 @@ The event binding listens for the button's click events and calls the component'
|
||||||
<img src='generated/images/guide/template-syntax/syntax-diagram.svg' alt="Syntax diagram">
|
<img src='generated/images/guide/template-syntax/syntax-diagram.svg' alt="Syntax diagram">
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
## Binding to passive events
|
||||||
|
|
||||||
|
Angular also supports passive event listeners. For example, you can use the following steps to make a scroll event passive.
|
||||||
|
|
||||||
|
1. Create a file `zone-flags.ts` under `src` directory.
|
||||||
|
2. Add the following line into this file.
|
||||||
|
|
||||||
|
```
|
||||||
|
(window as any)['__zone_symbol__PASSIVE_EVENTS'] = ['scroll'];
|
||||||
|
```
|
||||||
|
|
||||||
|
3. In the `src/polyfills.ts` file, before importing zone.js, import the newly created `zone-flags`.
|
||||||
|
|
||||||
|
```
|
||||||
|
import './zone-flags';
|
||||||
|
import 'zone.js'; // Included with Angular CLI.
|
||||||
|
```
|
||||||
|
|
||||||
|
After those steps, if you add event listeners for the `scroll` event, the listeners will be `passive`.
|
||||||
|
|
||||||
## Custom events with `EventEmitter`
|
## Custom events with `EventEmitter`
|
||||||
|
|
||||||
[Directives](guide/built-in-directives) typically raise custom events with an Angular [EventEmitter](api/core/EventEmitter) as follows.
|
[Directives](guide/built-in-directives) typically raise custom events with an Angular [EventEmitter](api/core/EventEmitter) as follows.
|
||||||
|
|
Loading…
Reference in New Issue