I have recently embarked on developing a basic app using Angular JS, utilizing a service/factory to manage data and enable the addition of objects.
Within the array of various individuals (listed in the html), you can include them as candidates by employing the addCandidate() function within the factory.
My current dilemma involves wanting to store people/objects from that array into multiple arrays such as candidates2 and candidates3, based on the active route/controller.
Do I need to rethink my approach or am I heading in the right direction?
Here are the factory and controllers:
var app = angular.module('myApp', []);
app.factory('Candidates', function (){
var candidates = [];
/* The aim is to populate this array with objects from myCtrl2 */
var candidates2 = [];
return{
addCandidate: function(candidate){
candidates.push(candidate);
}
/* Additional functions pertaining to Candidates */
}
});
app.controller('myCtrl1', function($scope, Candidates){
$scope.addCandidate = function(candidate){
Candidates.addCandidate(candidate);
}
});
/* The intention is to transfer candidates to candidates2 here */
app.controller('myCtrl2', function($scope, Candidates){
$scope.addCandidate = function(candidate2){
Candidates.addCandidate(candidate2);
}
});
/* More controllers similar in nature */
The HTML structure for reference:
<ul>
<li ng-repeat="person in people">
<h2>{{ person.name }}</h2>
<button ng-click="addCandidate(person)">Add candidate</button>
</li>
</ul>