angular-ui / ui-codemirror

This directive allows you to add CodeMirror to your textarea elements.
http://angular-ui.github.io/ui-codemirror
MIT License
378 stars 193 forks source link

Refresh problems when switching pages #111

Open Ledragon opened 9 years ago

Ledragon commented 9 years ago

Hi everyone, I started using the ui-codemirror directive a few days ago, and I have to say it is great. I however stumbled upon some refresh problems in a page with a parameter (not sure it is relevent though). What happens is that in some cases, my code is not rendered in the div where I use the directive. I have to click inside the element to have my code visible. After a bit of research, I came accross a StackOverflow post that helped me solve the problem. I actually changed ngModel.$render (line 118 in ui-codemirror.js) to include a refresh using timeout after setValue:

var safeViewValue = ngModel.$viewValue || '';
      codemirror.setValue(safeViewValue);
        setTimeout(function() {
            codemirror.refresh();
        }, 100);

I don't think it is ideal/perfect, but it works... I will try to post a plnkr of the not-working example later, to try and give a better overview of the problem. If I manage to reproduce it clearly, I will try and submit a PR comprising this fix (if it suits you of course). Best regards, Hugues

repetier commented 8 years ago

Even with your patch I had the problem for codes on a hidden tab. Only on the visible tab on page load it helped correctly. A better solution seems to use the display/autorefresh.js addon from codemirror and setting autoRefresh:true in options. This solved the problem for all cases I had.

Ledragon commented 8 years ago

Thanks for the info, I will check that. My solution was more a workaround than a solution, I'm glad to hear there is a cleaner way.

Ledragon commented 8 years ago

@repetier Your solution worked for me as well, I therefore recommend using that solution instead of what I proposed.