I struggled with this problem for a while. What worked was to bind the input to an object instead of a primitive. <!– Partial –> <input type=”checkbox” ng-model=”someObject.someProperty”> Check Me! // Controller $scope.someObject.someProperty = false
Late to the party, but there is a little angular ‘hack’ to achieve this without implementing a dumb directive. Adding a built-in directive that will extend your controller’s scope (like ng-if) everywhere you use the ng-include will actually let you isolate the variable name for all the included scopes. So: <div ng-include=”‘item.html'” ng-if=”true” onload=”item = … Read more
To understand why the solution with formHolder work you have to understand JavaScript prototypes chain first. Let’s illustrate the first case without formHolder in the following pseudo code: $parentScope = { //I’m a parent scope inside Ctrl2 productForm:{} //to avoid undefined reference error } $childScope = { //I’m a child scope created by by ng-include … Read more
It all depends on what you want from your code fragment. Personally, if the code doesn’t have any logic, or doesn’t even need a controller, then I go with ngInclude. I typically put large more “static” html fragments that I don’t want cluttering up the view here. (ie: Let’s say a large table whose data … Read more
As @Renan mentioned, ng-include creates a new child scope. This scope prototypically inherits (see dashed lines below) from the HomeCtrl scope. ng-model=”lineText” actually creates a primitive scope property on the child scope, not HomeCtrl’s scope. This child scope is not accessible to the parent/HomeCtrl scope: To store what the user typed into HomeCtrl’s $scope.lines array, … Read more