lundi 20 juin 2016

How to hide content with ng-if and a checkbox that's inside a ng-repeat and it's ng-model is an array

I have a list of checkboxes that are created using a ng-repeat, I use those checkboxes to get the IDs of the objects that are inside a list, these objects have a name property and a id property. this is a object inside my categoryList

category = {
   idCategory: 2,
   name: 'myName'
};

And this is how I declare my checkboxes.

<div class="form-group">
    <label>Select a category</label>
    <label class="checkbox-inline" ng-repeat="category in categoryList">
        <input type="checkbox" ng-model="idsCategory[category.idCategory]"> 
    </label>
</div>

and then in my controller I get the ids like this

var categories= $scope.categoryList;

var idsSelected = [];


//get selected ids
for (var idCategory in categories) {
    if (categories.hasOwnProperty(idCategory )) {
        if (categories[idCategory ] === true) {

            idsSelected .push(idCategory);
        }
    }
}

but now I want to hide and show some inputs in my HTML, if the user selects a category like "support" I want to show some inputs, but I don't know what condition put inside my ng-if since I declare my checkboxes ng-model like an array of ids like this ng-model="idsCategory[category.idCategory]"

how can I put my ng-if to hide the inputs I tried this but this doesn't work

<div id="b" ng-if="idsCategory.category.name=='Support'">
     <div class="form-group">
          <label>Support hours:</label>
          <input class="form-control" placeholder="support houres">
     </div>
</div>




Aucun commentaire:

Enregistrer un commentaire