removeAttr does not work with angularjs

Question

I am trying to remove the checked attribute from a set of radio buttons. I am using angularjs but I have tried with jquery and it is the same. Here is my code with angularjs:

 var radioList = angular.element(document.querySelectorAll(".radioButtons"));
        for (var i = 0; i <= radioList.length; i++) {
            radioList[i].removeAttr('checked');
        }

The error is:

TypeError: radioList[i].removeAttr is not a function

what am I doing wrong?? Thanks in advance.

UPDATE: Angular version: AngularJS v1.5.8

Answer 1

Your are performing 1 extra loop your loop condition should be i< instead of i<= should be like

for (var i = 0; i < radioList.length; i++) {
            radioList[i].checked=true;
        }

Here is working demo

Answer 2

First things first, angularJS makes use of jQuery internally so you can feel free to work with element selectors as you would do in jQuery. After calling the angular.element function, either you're returned no, one or multiple results you'll be returned a results array. As this array is jQuery-aware, you can call a jQuery function on its reference which will be called for every entry in the returned results array. So simply you can do this instead;

angular.element('.radioButtons').removeAttr('checked');

Answer 3

I solved the problem adding a value into my input.

<input type="radio" name="presetRadio" id="{{filterData.id}}"
       ng-model="currentRule.filters"
       value="{{filterData.id}}"          
       ng-checked="filterData.active" />

Thanks to all!!