When ng-if are trigerd?

Question

I am currently working on functionality for buttons that are opening directive in modal windows, and I wanted to created it simple is possible, so i took modal container and flag it with versus directive:

<div ng-if="vm.Modal.Modal1">
<directive-for-modal-one params="vm.params1"><directive-for-modal-one>
</div>
 <div ng-if="vm.Modal.Modal2">
<directive-for-modal-two params="vm.params2"><directive-for-modal-two>
</div>
....

And in controller there is a function that change activity of all of this modal, vm.Modal.n

function test(name){
        CloseModal();

        vm.Modals[name]= true

    }
function CloseModal() {

        for (var property in vm.Modals) {

            vm.Modals[property]= false;

            }
    }

And problem is in that if you click to open same modal two time, when even the value for ng-if are false and after that true, modal that is reopen are old one, wasn't destroyed. I understand that this is happening because javascript is single thread and that while it is function it will not close, how can I make angular check when this value is changed while I am still inside a function. some kinde refresh or chack command?

If i get u right u are trying to achieve the effect that after the `closeModel()` is executed, there should be a DOM rendering process (which may be some closing effect of modals because of `ng-if` value has changed) before running `vm.Modals[name]= true`? — MMhunter, Jul 20 '16 at 10:57
@MMhunter yes after closeModel() I need some process that will trigger that ng-if. Any idea? — Aleksandar, Jul 20 '16 at 11:00

score 1 · Answer 1 · answered Jul 20 '16 at 11:04

1

u can try put ur logic after CloseModal() in $scope.$evalAsync.

CloseModal();

$scope.$evalAsync(function(){
    vm.Modals[name]= true
})

this will ask the code to be executed after current $digest()

answered Jul 20 '16 at 11:04

MMhunter

1,431
1
11
18

Hi, thx for lead me to right way, $evalAsync from a controller that is in my case run before the DOM has been manipulated by Angular, so it is not solution for me. I used $timeout, it work fine in my case. – Aleksandar Jul 20 '16 at 13:08

score 0 · Accepted Answer · edited May 23 '17 at 11:46

0

I did this with using of $timeoutm.

    CloseModal();

$timeout(function(){
    vm.Modals[name]= true
})

There is explanation and comperation $timeout vs $evalAsync: AngularJS : $evalAsync vs $timeout

edited May 23 '17 at 11:46

Community

1
1

answered Jul 20 '16 at 14:16

Aleksandar

73
1
10

When ng-if are trigerd?

2 Answers2