The Wayback Machine - http://web.archive.org/web/20220321174228/https://github.com/angular/angular/issues/44714
Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Usage of ngZone.run for new async apis that zone.js hasn't pathced #44714

Closed

Alan-LOL opened this issue Jan 14, 2022 · 5 comments
Closed

Usage of ngZone.run for new async apis that zone.js hasn't pathced #44714

Alan-LOL opened this issue Jan 14, 2022 · 5 comments
Labels
comp: docs good first issue help wanted
Milestone
needsTriage

Comments

@Alan-LOL
Copy link
Contributor

@Alan-LOL Alan-LOL commented Jan 14, 2022

Description

Is this demo correct? how ngZone knows when to update the view as zone.js hasn't patch someNewAsyncAPI

export class AppComponent implements OnInit {
  constructor(private ngZone: NgZone) {}
  ngOnInit() {
    // New async API is not handled by Zone, so you need to
    // use ngZone.run() to make the asynchronous operation in the Angular zone
    // and trigger change detection automatically.
    this.ngZone.run(() => {
      someNewAsyncAPI(() => {
        // update the data of the component
      });
    });
  }
}

What is the affected URL?

https://angular.io/guide/zone#ngzone-run-and-runoutsideofangular

Please provide the steps to reproduce the issue

No response

Please provide the expected behavior vs the actual behavior you encountered

I think the demo code should be updated as below:

export class AppComponent implements OnInit {
  constructor(private ngZone: NgZone) {}
  ngOnInit() {
    // New async API is not handled by Zone, so you need to
    // use ngZone.run() to make the asynchronous operation in the Angular zone
    // and trigger change detection automatically.
-    this.ngZone.run(() => {
      someNewAsyncAPI(() => {
+        this.ngZone.run(() => {
        // update the data of the component
+        });
      });
-    });
  }
}

Please provide a screenshot if possible

No response

Please provide the exception or error you saw

No response

Is this a browser-specific issue? If so, please specify the device, browser, and version.

No response
@ngbot ngbot bot added this to the needsTriage milestone Jan 14, 2022
@JoostK
Copy link
Member

@JoostK JoostK commented Jan 14, 2022

I believe you are correct; NgZone.run needs to be within the async closure, not around its registration.

@Alan-LOL
Copy link
Contributor Author

@Alan-LOL Alan-LOL commented Jan 15, 2022

@JoostK Thanks for your reply, it's been confusing me for two days now. I dug deep into zone.js, but still didn't find out how zone knew when the async callback was triggered in this demo.

Alan-LOL added a commit to Alan-LOL/angular that referenced this issue Jan 17, 2022
@Alan-LOL
docs: correct the demo code of NgZone.run
bd5117b 
`NgZone.run` needs to be within the async closure, not around its registration, refer to: angular#44714

@Alan-LOL Alan-LOL mentioned this issue Jan 17, 2022

Closed
14 tasks
jessicajaniuk added a commit that referenced this issue Feb 1, 2022
@Alan-LOL @jessicajaniuk
docs: correct the demo code of NgZone.run (#44733)
b6d2212 
`NgZone.run` needs to be within the async closure, not around its registration, refer to: #44714
PR Close #44733
jessicajaniuk added a commit that referenced this issue Feb 1, 2022
@Alan-LOL @jessicajaniuk
docs: correct the demo code of NgZone.run (#44733)
5d7ffd5 
`NgZone.run` needs to be within the async closure, not around its registration, refer to: #44714
PR Close #44733
@wbeeftink
Copy link

@wbeeftink wbeeftink commented Feb 11, 2022

This issue can be closed, right? The docs are fixed as far as I can tell and the PR was closed too.

@JoostK
Copy link
Member

@JoostK JoostK commented Feb 11, 2022

Indeed!

@JoostK JoostK closed this Feb 11, 2022
@angular-automatic-lock-bot
Copy link

@angular-automatic-lock-bot angular-automatic-lock-bot bot commented Mar 14, 2022

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Mar 14, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
comp: docs good first issue help wanted
Projects
None yet
Milestone
needsTriage
Linked pull requests

Successfully merging a pull request may close this issue.

None yet
3 participants
@JoostK @wbeeftink @Alan-LOL