Currently, I am attempting to bind a model from inside an ng-repeat within a directive to the outer controller. In the outer controller, there is a variable that I would like to bind, as shown below:
//in the directive scope
filterArray: '='
Within the directive, this binding should occur for a model inside an ng-repeat like the following example:
//inside the directive
<li ng-repeat="value in filter.values">
<input type="checkbox" ng-model="filterObject[filter.name][value]" ng-change="filterChange()">{{value}}
</li>
This setup was functioning properly until I changed the directive to have an isolated scope. Now, it returns an error stating "cannot set property of undefined." Is there a solution to make this work as intended? The goal is for the variable to populate when the user interacts with the inputs, allowing the outer controller to access the finalized object.
I realize this explanation may be confusing; therefore, I created a fiddle for clarification: https://jsfiddle.net/vt1uasw7/42/ .
The objective is for the outer controller to retrieve the object constructed through model binding - a feature that was functional before implementing the isolated scope. Thank you!
Edit: Perhaps the solution in this scenario is to avoid using an isolated scope? This predicament has left me puzzled, despite trying numerous combinations of scope attributes :(.