For these sort of tasks I'd recommend underscore.js. Either diff() or filter() http://underscorejs.org/. Even if you use a directive, you have to write the logic to perform the task, but no, don't use a directive, write smart functions and use cool tools like underscore.
Then if you are using $http, something like: $scope.myItems = []; $scope.availableItems = []; $http.get("/api/my-items").then(function(myItems){ $scope.myItems = myItems; getAvail(); }); function getAvail(){ $http.get("/api/avail-items").then(function(avaiItems){ //if primitive values use diff() $scope.availableItems = _.diff(avaiItems, $scope.myItems); //or if it's an array of objects and say you can identify by id field, then here's an example with filter() var ids = _.pluck($scope.myItems, 'id' ); //creates an array of ids from myItems $scope.availableItems = _.filter(avaiItems, function(item){ //now we just check the index return _,indexOf(ids, item.id) == -1; //returns true if index not found so will be in the final item, false if found so will be eliminated }); }); } Though, I might do it a third way and use an attribute on availableItems for whether or not the item is in myList. Hope that gives you some direction. On Monday, July 28, 2014 1:40:42 PM UTC-6, Skattabrain wrote: > > AngularJS noob here with a design question. > > I have 2 lists... one is a list of items for a specific group. Let's call > the group "My Items". The 2nd list is a master list of all the items > available - "Available Items". > > This 2nd list can be changed out for other lists. So you might have > "Available Items of Type 1" and "Available Items of Type 2" etc... > > I show the "Available Items" on the left and the "My Items" on the right. > > If you visualize a shopping cart system where the available items are on > left and you are moving them into your "cart", that's a good way to > visualize this. > > $scope.myItems = [] > and > $scope.availableItems = [] > > So I start off with 2 ajax calls... 1 for 'my items' and the 2nd call gets > the currently selected 'available items' lists. > > The available items on the left may include items that are in 'my list' > but they should not be shown. I have a relatively in-efficient loop I run > through to see if the item is in "my items" and if it isn't, I push it to > the scope - $scope.availableItems > > There is the issue that the 'myItems' list has to be completed before i > call for the availableItems in case myItems isn't complete... as the > comparison will not be right. > > I then have tools to move selected items in and out of the myItems. > > Is there a better way though the use of a directive that will watch for > changes to myItems and remove/add them to the availableItems? > > I've been dropped into AngularJS with a relatively complicated task. These > lists involve thousands of items and we chose angular because i can throw > 15,000 items into a scope and as long as I have paging setup... i can > filter and sort the whole thing easily, that's working amazingly well. > -- You received this message because you are subscribed to the Google Groups "AngularJS" group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.