Search code examples
angularjsangular-filters

Cannot create property 'type' on string - radio button filters


If I define radio button filters in Angular like so:

<input type="radio" ng-model="filter.type" value="rose"  class="type-filter"> Rose<br>
<input type="radio" ng-model="filter.type" value="tomato"  class="type-filter"> Tomato<br>

And the ng-repeat to show the data is:

<div ng-repeat="node in allnodesFiltered | filter:{ plantArray: filter.type}" class="row product-item">
{{node.title}}

The filtering works perfectly. BUT, if I try to use ng-repeat in the filter like this:

<div ng-repeat="plant in plantFilters">
    <input type="radio" ng-model="filter.type" ng-value="filter"  class="type-filter"> Grass
          {{plant}}
    </div> 

I get the error:

TypeError: Cannot create property 'type' on string 'rose'
at fn.assign (eval at <anonymous>

Here is an example of an item in the json array:

title: "Euismod Lucidus Oppeto Probo",
body: "Abico adipiscing facilisi nunc singularis sudo. Antehabeo humo     melior neo obruo ulciscor voco. Aliquam commoveo ea mauris nutus os saepius zelus. Brevitas dolus uxor. Ad cogo decet nobis nutus obruo olim turpis venio virtus. Damnum dignissim lobortis meus mos plaga. Eros iriure loquor macto natu paulatim vel. Consequat humo jus nulla. Abico conventio ibidem si tum typicus uxor volutpat. Diam nutus uxor ymo. Abluo caecus imputo loquor lucidus macto nibh obruo usitas.",
Path: "public://product-images/imagefield_THXgQg.jpg",
productType: "Compost, Weedkiller",
plant: "Rose, Tomato"

Solution

  • I managed to figure this out. In the ng-model you can refer to the parent like this:

    ng-model="$parent.filter.type"
    

    I would love it if someone could exaplain how this works. But thanks for the input Akhilesh Jaiswal