angularjsangularjs-directive

AngularJS ng-style with a conditional expression

I am handling my issue like this:

ng-style="{ width: getTheValue() }"

But to avoid having this function on the controller side, I would much prefer to do something like this:

ng-style="{ width: myObject.value == 'ok' ? '100%' : '0%' }"

How can I do this?

Solution

  • As @Yoshi said, from angular 1.1.5 you can use-it without any change.

    If you use angular < 1.1.5, you can use ng-class.

    .largeWidth {
    width: 100%;
}

.smallWidth {
    width: 0%;
}

// [...]

ng-class="{largeWidth: myVar == 'ok', smallWidth: myVar != 'ok'}"