Using Angular ng-attr for the disabled attribute

Question

I am trying to use ng-attr to conditionally add an attribute to an element. My code is something like this:

<label for="theID" 
       ng-attr-disabled="{{true || undefined}}"
       class="control-label">
  Some Label
</label>

What I get by inspecting the element is this:

<label translate="" for="theID" 
       ng-attr-disabled="{{true || undefined}}" 
       class="control-label ng-scope" disabled="disabled">
  Some Label
</label>

But expectation is:

<label translate="" for="theID" 
       ng-attr-disabled="{{true || undefined}}" 
       class="control-label ng-scope"
       disabled>
  Some Label
</label>

am I wrong altogether about how it works?

Thanks

Answer 1

I don't think you should care about it, in your case. When value is falsy, disabled is not present. When value is truthy, is present - and it's all about presence in HTML about attributes like this (like required on inputs, validation care about presence required="false" makes input required). For example, you can style it dependent on attribute presence: MDN Attribute selectors.