Ninja
Ninja

Reputation: 1052

How to conditionally control/stop data-toggle in Bootstrap?

For a simple listed item with a data-toggle, I was just wondering how to conditionally stop a data-toggle.

%li{'data-toggle'="modal", 'data-target'='#myModal'}

I am looking for something like:

%li{'data-toggle'="admin"?"modal":"", 'data-target'='#myModal'}

Where admin is an angularJS variable. Just wondering if something like this is possible. I tried the above code and it doesn't not work as expected.

Upvotes: 3

Views: 11644

Answers (1)

user2943490
user2943490

Reputation: 6940

I don't know the specifics of the HAML syntax within an Angular context, but there are a number of ways you can do this in HTML. I'm sure the same concepts would apply when translated to HAML.

interpolation

<li data-toggle="{{admin ? 'modal' : ''}}" data-target="#myModal">

ng-attr

<li ng-attr-data-toggle="{{admin ? 'modal' : ''}}" data-target="#myModal">

ng-if

<li ng-if="admin"  data-toggle="modal" data-target="#myModal">
<li ng-if="!admin" data-toggle=""      data-target="#myModal">

Upvotes: 10

Related Questions