0

i want to avoid change detection, i tried one method but i want to use outside of angular concept

plunkr sample *this link has my plunkr sample , i tried one method to avoid change detection which creating micro task *

onClick() {
    this.num++;
    
    this.cdRef.detach();
    this.ngZone.onMicrotaskEmpty.first().subscribe(() => {
      this.cdRef.reattach();
    });
  }

i refered this question but i could not find my sollution relative question

Kumaresan Sd
  • 1,399
  • 4
  • 16
  • 34
  • Why do you need to prevent change detection? – Bunyamin Coskuner Apr 18 '18 at 06:31
  • in my project performance lack issue occurred so my frd suggest me to avoid change detection – Kumaresan Sd Apr 18 '18 at 06:42
  • You can set your component change detection to `OnPush` in component metadata. Have you tried that? – Bunyamin Coskuner Apr 18 '18 at 06:44
  • can you please see this plunkr. https://plnkr.co/edit/6Ea2PFW9a186TBQxES1r?p=preview – Kumaresan Sd Apr 18 '18 at 06:47
  • i simply created micro-task to avoid change detection ,it worked fine – Kumaresan Sd Apr 18 '18 at 06:48
  • Then what is your question? Also, It's not about `higher authority told me to do so`, it's `why do we need it? Can we achieve better performance in a better way`. Show me some of your code, and explain where the performance issue occurs. – Bunyamin Coskuner Apr 18 '18 at 06:50
  • okay wait, i will show where performance issue occur – Kumaresan Sd Apr 18 '18 at 06:53
  • Do not send the whole project. Just show your component and problematic part. Also, if you want to share your entire project, can you provide a github repo? – Bunyamin Coskuner Apr 18 '18 at 07:00
  • i am not gonna share my entire project. i will send my sample only..... – Kumaresan Sd Apr 18 '18 at 08:38
  • did you see this -> https://plnkr.co/edit/6Ea2PFW9a186TBQxES1r?p=preview – Kumaresan Sd Apr 18 '18 at 08:40
  • Yes, I already clicked on that link when you put it in your question but it does not mean anything to me. I still don't know what you are trying to achieve. – Bunyamin Coskuner Apr 18 '18 at 10:39
  • in that plunkr, i used " this.ngZone.onMicrotaskEmpty.first().subscribe(() => { " this methid to avoid change detection – Kumaresan Sd Apr 18 '18 at 10:56
  • but i want use like this "this.zone.runOutsideAngular(() => { ".....for reference see this question==> https://stackoverflow.com/questions/38995262/how-to-disable-angular2-change-detection-for-3rd-party-libraries/39626378#39626378 – Kumaresan Sd Apr 18 '18 at 10:58
  • Then, just use it. What's the problem? – Bunyamin Coskuner Apr 18 '18 at 11:00
  • i dint know how to that method, that is problem so only i created this question bro? – Kumaresan Sd Apr 18 '18 at 11:12
  • can you please say how to inject that concept into my plunkr project instead of this "this.ngZone.onMicrotaskEmpty.first().subscribe" – Kumaresan Sd Apr 18 '18 at 11:13
  • Okay, there is a communication problem between us. You said that you found an example and tried to use it within your code without even sharing your own code. I still haven't seen your code or understood your problem. If you want to use `ngZone.runOutsideAngular`, just use it. I cannot tell you how to implement it within your code without even seeing it. Please, if you don't share any more information, I won't even try to help you. – Bunyamin Coskuner Apr 18 '18 at 11:17
  • okay, that plunkr is my sample bro, i have to create sample with "ngZone.runOutsideAngular" method so i created that sample. there i dont know how to use "ngZone.runOutsideAngular" – Kumaresan Sd Apr 18 '18 at 11:20
  • Possible duplicate of [Angular 2 runOutsideAngular still change the UI](https://stackoverflow.com/questions/40300635/angular-2-runoutsideangular-still-change-the-ui) – Bunyamin Coskuner Apr 18 '18 at 11:23
  • okay bro thanks a lot, again we have communication problem – Kumaresan Sd Apr 18 '18 at 11:29
  • i already saw that question but there they dint give solution to "how to use runoutsideAngular method" – Kumaresan Sd Apr 18 '18 at 11:30

1 Answers1

0

 onClick() {
    debugger
    this._ngZone.runOutsideAngular(() => {
      // this.num++
      setTimeout(()=>this.num = 5);    
      });
  }

i used this code instead of using microtask method, it works fine

Kumaresan Sd
  • 1,399
  • 4
  • 16
  • 34