Angular: Disable button if value exist in object array with ng-repeat

Question

I have list of groups and generate that group list in HTML with ng-repeat(list of buttons) and its working perfectly. But in case when i am trying to disable some buttons with ng-disabled by call function to check the value, i just amazed my loop and buttons showing correctly but ng-disable="myfunc()" called many times.

My Code:

<button class="button button-block button-calm btn-shape" ng-click="startSurvey(group.survey_id,group.id)"  ng-repeat="group in groupList" ng-disabled="checkGroupCompleted($index)">
    {{group.title}}
</button>

Group List:

Controller:

$scope.checkGroupCompleted = function(groupID){
        console.log(groupID);

    }

Console Output:

I just need similar functionality: JSFiddle

You are use ng-repeat in button it self so when loop start function it self fire many time so you can put ng-repeat to its parent element and then after put button inside after that you add ng-disabled to button and check it. — Gohel Dhaval
– Gohel Dhaval, Commented Mar 24, 2017 at 11:04
I think its because your function is not returning anything. It needs to return true for enabled and false for disabled. — Brmmmm
– Brmmmm, Commented Mar 24, 2017 at 11:08

Saurabh Agrawal · Accepted Answer · 2017-03-24 11:22:21Z

1

This is what angular is all about. Whenever your $scope will get modified each time digest cycle will run so each and every function is going to be called.

In case of ng-show, ng-show, ng-disabled etc same process it follows.

answered Mar 24, 2017 at 11:22

Saurabh Agrawal

7,7553 gold badges31 silver badges52 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Vamidi · Accepted Answer · 2017-03-24 11:02:28Z

0

$scope.checkGroupCompleted = function(groupID) {
    return (groupID === 1);
}

if the value is 1 it will return true or else false

answered Mar 24, 2017 at 11:02

Vamidi

413 bronze badges

Comments

Gohel Dhaval · Accepted Answer · 2017-03-24 11:08:16Z

0

You are use ng-repeat in button it self so when loop start function it self fire many time so you can put ng-repeat to its parent element and then after put button inside after that you add ng-disabled to button and check it.

For ex.

<div> ng-repeat=groups in group>
    <button> ng-disabled="checkGroupCompleted($index)"></button>
</div>

    $scope.checkGroupCompleted = function(groupID){
         return (groupID === 1);
    }

answered Mar 24, 2017 at 11:08

Gohel Dhaval

8301 gold badge8 silver badges12 bronze badges

Collectives™ on Stack Overflow

Angular: Disable button if value exist in object array with ng-repeat

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related