I have two input fields inside my ion-content and they both have an ng-model attached to them. Then inside my ion-footer I have an ng-click where I call a function and pass in the two ng-models.
This all worked fine when I had the ng-click inside the ion-content, but when I move it to the footer I get undefined for the two parameters I pass to the function.
So does this mean that ion-content and ion-footer have different $scope's? Even though they're in the same file and have the same controller??
Explanation of the answer in the comments by pankajparkar:
the ion-content directive has its own isolated scope. It works using the dot notation (important when dealing with scope inheritance)
That is why it works with ng-model="data.model1
Please refer to:
I believe ion-footer & ion-content creates new child scope which is prototypically inerherit from current scope.
You need to use . annotation will fix your problem
Eg.
If you are using variable as primitive like
$scope.volume = 5
Then You need to use :
$scope.data = { 'volume' : 5}