I'm tryning to access $scope
in my angularjs
(ionic framework
) controller are getting this error
ReferenceError: $scope is not defined
Following is my setup
#directive recipe form
angular.module('directive.recipeForm',[])
.directive('recipeForm', function(){
return {
restrict: 'E',
controller: 'newRecipeCtrl',
scope: false,
templateUrl: 'templates/directives/recipe_form.html'
}
});
#templates/directives/recipe_form.html
<form ng-submit="recipeSave()">
<input type='text' ng-model='recipeFormData.name' >
<input type="submit" id="submit" value="Submit" />
</form>
#recipe controller
angular.module('ft.controllers.newRecipe', [])
.controller('newRecipeCtrl', ['$scope', '$rootScope', '$ionicModal', '$timeout', '$http', 'Settings',function($scope, $rootScope, $ionicModal, $timeout, $http, Settings){
$scope.recipeFormData={ name: 'sample name' };
$scope.recipeSave = function(){
// error from comes here
}
}]);
And when the form loads it correctly access the values in $scope.recipeFormData
and set the text box value to 'sample name', but when I click save button, it fires the recipeSave
method , but inside that I dont have the $scope
variable
And I do understand that there are lots of SO questions with the same error, and I checked them too. but most of them users controller directly binded to the view, not as a directive.
What I could be doing wrong, thanks in advance
cheers
I am not sure what the problem of this error is. But in such case (changing context variables: this, $scope etc.) you may "save" them in self variable:
angular.module('ft.controllers.newRecipe', [])
.controller('newRecipeCtrl', ['$scope', '$rootScope', '$ionicModal', '$timeout', '$http', 'Settings',function($scope, $rootScope, $ionicModal, $timeout, $http, Settings){
var self = $scope;
$scope.recipeFormData={ name: 'sample name' };
$scope.recipeSave = function(){
//here refer to self
}
}]);