Semantic UI dropdown not able to disable using select input + AngularJS - html

Question

I'm trying to disable a dropdown depending of a value of a different input. I'm working with Semantic UI and Angular.
This is my HTML
<select class="ui search dropdown" ng-attr-id="{{'dd-' + question.id}}"
ng-options="option.value as option.text for option in question.options"
ng-model="question.answer"
ng-disabled="!question.isEnable">
</select>
And this is how is rendered
<div class="ui search dropdown ng-pristine ng-untouched ng-valid selection">
<select ng-attr-id="{{'dd-' + question.id}}" ng-options="option.value as option.text for option in question.options" ng-model="question.answer" ng-disabled="!question.c_questionIsEnable" id="dd-483" disabled="disabled">
<option value="" class="" selected="selected"></option>
<option label="Yes" value="string:213">Yes</option>
<option label="No" value="string:214">No</option>
<option label="Does not apply" value="string:547">Does not apply</option>
</select>
<i class="dropdown icon"></i><input class="search" autocomplete="off" tabindex="0">
<div class="text"></div><div class="menu transition hidden" tabindex="-1">
<div class="item selected" data-value="string:213">Yes</div>
<div class="item" data-value="string:214">No</div>
<div class="item" data-value="string:547">Does not apply</div>
</div>
</div>
As you can see in the rendered code the disabled attribute is present in the <select>,
nevertheless the dropdown is not disabled. Reading the Semantic UI docs, there is a way to set a dropdown in a disable state using the css class disabled but is not working either (the css class is added to the <select>)
HTML code with using class
<select class="ui search dropdown" ng-attr-id="{{'dd-' + question.id}}"
ng-options="option.value as option.text for option in question.options"
ng-model="question.answer"
ng-class="{'disabled': !question.isEnable}">
</select>
Indeed, the class disabled is added to the select input but the dropdown is not disabled, using Chrome Dev Tools, the element gets disabled if I add the class in the following line
<div class="ui search dropdown ng-pristine ng-untouched ng-valid selection disabled">
Is there a way for make this work using <select>?.
Thanks in advance.

Answer 1

There is an easy way to do this.
Wrapping the in a with the field css class, and use the ng-class attribute in there.
Hope this could help.
<div class="ui field" ng-class="{'disabled': !question.isEnable }">
<select class="ui search dropdown" ng-attr-id="{{'dd-' + question.id}}"
ng-options="option.value as option.text for option in question.options"
ng-model="question.answer">
</select>
</div>