I am facing a challenge with an AngularJS application I am currently working on. My background is more in jQuery development, so please bear with me ;)
The issue lies in a factory that retrieves categories through an $http call:
app.factory('simpleFactory', function($http, $routeParams) {
var categories = [];
var factory = {};
factory.getCategories = function() {
return $http({
url: '/system/getlist/',
data: { id : pageID },
method: "POST",
})
.success(function(addData) {
categories = addData;
});
}
return factory; });
My controller sets up a scope to fetch the data from the factory:
app.controller('loadCategories', function ($scope, simpleFactory) {
$scope.categories = [];
init();
function init() {
$scope.categories = simpleFactory.getCategories();
}
});
Now, I have a second scope triggered from my view (createCategory()) to add a new item to my categories. I attempted to push this new item into the existing $scope.categories like so:
$scope.createCategory = function(cat,catName,catLvl,catType) {
var catName = catName;
var parentID = cat.id;
$http({
url: '/system/createcategory/',
data: { catName : catName, parentID : parentID, pageID: pageID, catLvl: catLvl, catType: catType },
method: "POST",
})
.success(function(addData) {
$scope.categories.push(addData);
});
}
This additional controller also resides within the loadCategories controller.
THE ISSUE:
Upon trying to push() something into my $scope.categories, I encounter the following error:
TypeError: Object # has no method 'push'
Any insights on why this error occurs? Am I implementing something incorrectly?
The ajax call completes and the success callback is triggered, but there seems to be an issue with the push().
As I am still learning AngularJS, your patience is greatly appreciated :)