Show parameter only if no results are found

I am trying to hardcode on an option for a select list ng-options

when the scope it is being pulled from has no answers. I was able to achieve this in another scenario by doing something like this:

ng-show="!$scope.length"

      

However, it doesn't seem to work inside the picklist itself. Perhaps doing something with Angular ng-options

? Here's my attempt:

<select ng-model="myModel" ng-options="option.title for option in optionsList">
    <option ng-show="!optionsList.length">There are no prompts for this lesson.</option>
</select>

      

I have hardcoded the parameter inside select with the same logic, but it doesn't seem to want to work. Thanks in advance!

+3


source to share


2 answers


One way to do this is to create a filter that inserts the default option if empty ...

.filter('defaultOptionIfEmpty', function () {
    return function (items, defaultItem) {
        return items.length ? items : [defaultItem];
    }
});

      

Use it like this:



<select ng-model="foo" ng-options="item.value for item in items | defaultOptionIfEmpty : {id: 0, value: 'There are no prompts for this lesson.'}">
</select>

      

Fiddle

+1


source


Assuming your data is for the "dataBlocksHere.currentData.selections" parameters, you need to preprocess this block to check if there is anything in it and insert the appropriate content into it. So, before you assign the scope element, process the results in your javascript.



 if(!dataBlocksHere.currentData.selections){
      // insert item into selections, something like
      dataBlocksHere.currentData.selections['data'] = {id: 0, data: "There are no prompts for this lesson."};

 }

      

0


source







All Articles