Semantic UI dropdown not able to disable using select input + AngularJS
<p>I'm trying to disable a dropdown depending of a value of a different input. I'm working with Semantic UI and Angular.</p>

<p>This is my HTML </p>

<pre><code>&lt;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"&gt;
&lt;/select&gt;
</code></pre>

<p>And this is how is rendered</p>

<pre><code>    &lt;div class="ui search dropdown ng-pristine ng-untouched ng-valid selection"&gt;
    &lt;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"&gt;
    &lt;option value="" class="" selected="selected"&gt;&lt;/option&gt;
    &lt;option label="Yes" value="string:213"&gt;Yes&lt;/option&gt;
    &lt;option label="No" value="string:214"&gt;No&lt;/option&gt;
    &lt;option label="Does not apply" value="string:547"&gt;Does not apply&lt;/option&gt;
    &lt;/select&gt;
    &lt;i class="dropdown icon"&gt;&lt;/i&gt;&lt;input class="search" autocomplete="off" tabindex="0"&gt;
&lt;div class="text"&gt;&lt;/div&gt;&lt;div class="menu transition hidden" tabindex="-1"&gt;
&lt;div class="item selected" data-value="string:213"&gt;Yes&lt;/div&gt;
&lt;div class="item" data-value="string:214"&gt;No&lt;/div&gt;
&lt;div class="item" data-value="string:547"&gt;Does not apply&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>As you can see in the rendered code the disabled attribute is present in the <code>&lt;select&gt;</code>, 
nevertheless the dropdown is not disabled. Reading the Semantic UI docs, there is a way to set a dropdown in a <a href="http://semantic-ui.com/modules/dropdown.html#disabled" rel="nofollow">disable state</a> using  the css class <strong>disabled</strong> but is not working either (the css class is added to the <code>&lt;select&gt;</code>)</p>

<p>HTML code with using class</p>

<pre><code>&lt;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}"&gt;
    &lt;/select&gt;
</code></pre>

<p>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 </p>

<pre><code>&lt;div class="ui search dropdown ng-pristine ng-untouched ng-valid selection disabled"&gt;
</code></pre>

<p>Is there a way for make this work using <code>&lt;select&gt;</code>?.</p>

<p>Thanks in advance.</p>