angular.js - Problems with ng-if and ng-show under IE8

Question

I am currently working on an angular js project. I have been worrying about a bug all morning this morning,
That is, a pop-up box appears in ng-if. The instruction of the pop-up box refers to a template. There is a script in the template. There is no problem in other browsers, but the script is not executed under IE8.
I checked a lot of problems with script execution in IE8, including adding the defer attribute to the script tag, but it didn't solve the actual problem.
Later I found out that it was not that the script could not be executed, but that the script was executed when the main page was loaded (ng-if was false and the pop-up box did not appear).
It is said on the Internet that ng-if will remove dom and generate dom, while ng-show only changes its display attribute,
It stands to reason that the dom should not be loaded and the script executed until ng-if="true" is set?
But after changing ng-if to ng-show, I found that the problem was suddenly solved. In IE8, the script was executed after clicking the pop-up box perfectly.
I don't understand why this is happening, can anyone tell me?

Answer 1

I don’t understand how to solve the bug. As for the parsing process of angular, I can explain:

Although what we see in the DOM viewer is the result after angular parsing, the browser actually loads the dom element first, and then angular executes it to find various instructions and then parses the results.

So angular has several quirks: ng-bind replaces {{ expression }} to solve the curly brace flashing problem, you cannot define href instructions to use on a tags, and other similar reasons are the same.

ng is not a background template. For the background language, the template is various string parsing and splicing, but ng runs in the browser. HTML will first become a dom element. ng is not manipulating strings, but in Manipulate dom elements.

Answer 2

You should have bound controller models in ng-if and ng-show, right?

Looking at your solution process, I guess:
ng-if defaults to true
ng-show defaults to false

So when using ng-if, the script in the template will be executed before the model is calculated
But this may also be a special situation on ie8

I have a suggestion, don’t put the script directly in the template, for example, put it in the controller of the template. You can also use ng-if in this way