current community

your communities

more stack exchange communities

company blog
Stack Exchange Inbox Reputation and Badges
tour help
Stack Overflow is a community of 4.7 million programmers, just like you, helping each other.

Join them; it only takes a minute:

Sign up
Join the Stack Overflow community to:
  1. Ask programming questions
  2. Answer and help your peers
  3. Get recognized for your expertise
up vote 1 down vote favorite

I have an array that contains a bunch of objects. If there are no objects that contains a "true" value for the key "completed", I would like to disable a button.

//Here is the format for the array of objects:

$scope.todos = [{
                task:$scope.task,
                completed: false,
                localID:Date.now(),
                display: true
}];

//Here is the button I want to disable::

<button ng-click="clear()" class="btn" ng-disabled="">Clear Completed</button>

Any help is appreciated.

share|improve this question
up vote 2 down vote accepted

You could place filter over your todos object and check for there length.

Markup

<button ng-click="clear()" class="btn" (todos | filter: {completed:true}).length < 1>
     Clear Completed
</button>

Working Fiddle

share|improve this answer
    
much better than my solution .... but need to get it to work jsfiddle.net/arunpjohny/cp1ttr8t/5 – Arun P Johny Aug 21 '15 at 6:45
    
give me a one minute...i will figure it out – Pankaj Parkar Aug 21 '15 at 6:47
    
@ArunPJohny check updated jsfiddle.net/3nxt66b6 – Pankaj Parkar Aug 21 '15 at 6:49
    
I like this solution, but it's not quite working – Triode Aug 21 '15 at 6:53
    
I have this: but it is only working when everything is checked: ng-disabled="(todos | filter: !{completed:false}).length > 0" – Triode Aug 21 '15 at 6:55
up vote 3 down vote

You can check something like

var app = angular.module('my-app', [], function() {})

app.controller('AppController', function($scope) {
  $scope.todos = [{
    task: $scope.task,
    completed: false,
    localID: Date.now(),
    display: true
  }];

  $scope.isDisabled = function() {
    return $scope.todos.some(function(item) {
      return item.display === true
    })
  }


})
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="my-app" ng-controller="AppController">
  <input type="checkbox" ng-model="todos[0].display" <br />
  <button ng-click="clear()" class="btn" ng-disabled="isDisabled()">Clear Completed</button>
</div>

share|improve this answer
    
jsfiddle.net/arunpjohny/tge6j26e – Arun P Johny Aug 21 '15 at 6:46
    
Good solution... – Mohan Singh Aug 21 '15 at 6:46
up vote 1 down vote 
ng-disabled="(todos | filter: {completed:true}).length < 1"
share|improve this answer
up vote 0 down vote

you can try:

html:

<button ng-click="clear()" class="btn" ng-disabled="isDisabled()">Clear Completed</button>

in controller:

$scope.isDisabled = function () {
        var disabled = true;
        angular.forEach($scope.todos, function(todo){
            if(todo.completed === true){
                disabled = false;
            }
        });
        return disabled;
    };
share|improve this answer
    
Working code in PLUNKER : plnkr.co/edit/xN9cE5wdywv7BTu6Gt2K?p=preview – shaishab roy Aug 21 '15 at 7:23

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.