CODEWITHSUNDEEP
cssangularjs
BT101
BT101

Reputation: 3826

Change element order from controller angularJS

Hello so if some variable exists (token within) I want to change 2 divs order - turn them other way around, from controller.

I found way to do this with ng-repeat directive but I don't really want to use ng-repeat in this case because I already have many ng-repeats in this two divs and I think it may cause some problems, maybe even longer loading.

Is there any other way to change divs order from controller? Maybe I can just add some classes to elements whenever variable exists or not, if I remember good I can change elements order with flexbox help.

Could you guys show me path how to accomplish this task? I would be grateful if you provide some little demo.

Upvotes: 1

Views: 652

Answers (1)

BT101
BT101

Reputation: 3826

Nobody answered my question which I already have found solution for. Someone in comment section said that I should use ng-repeat because it's good solution but I could not really figure out how to use it and keep tone of html content inside those 2 divs. I don't want to bind all of it from controller, do I?

So what I did instead is wrap this 2 divs inside another div with display: flex and then used ng-class directive on this 2 divs inside new container to dynamically add classes with this rules:

1st div

.flex-container--child_1 {
    order:2;
}

2nd div

.flex-container--child_2 {
    order:1;
 }

The ng-class add this two classes to divs whenever some variable exist like I wanted.

<div ng-class="{'flex-container--child_1': authentication.isAuth}">...</div>

I wrote this post if somebody ever came across same problem and find this question on SO.

Upvotes: 1

Related Questions