Now we need to create the factory.
Well the first thing we need to do is to scroll all the way up and
look at our factory declaration.
So the factory declaration is dot factory.
We're going to give it the factory name, which is our shopping list factory, and
the function that is going to be our factory function.
Which is in this case again shopping list factory.
Note, that we don't need to register the shopping list service
here within that service method.
That's because we don't want angular to create the shopping with service for us.
We want to create that service ourselves.
Let's go ahead and scroll to the shopping list factory,
and you can see it's very simple and you can see also that we're using
kind of the function approach here instead of the object literal approach.
And our factory is a function that takes the max number of items, and it will
return a new shopping list service, passing it the max number of items.
And so, what will get returned as part of the execution of the shopping list
factory is a function that takes these max number of items and
returns the shopping list list service.
Now all it's left is take a look at the code of the controllers.
Let's go ahead and scroll up to the first controller which is called list one,
that's how we nicknamed it in our template,
cus we are using a controller as syntax.
You can see that we're injecting the shopping list factory into our
shopping list controller one.
And in order for us to get a new shopping list, you could see that we're using our
shopping list factory and simply executing it.
Note, we're not passing anything into it,
which means the max number of items is going to be undefined.
But since the shopping list factory refers to a function that is being returned
out of it, putting parentheses behind it will execute that function and
will execute the new shopping list service.
And that's why we have shopping list as our local variable here,
as an instance of the shopping list service.
Once we have that, we obviously can now start calling methods on it.
Like getItems and you could see here when we add the item,
we could just say shoppingList.addItem, list1.itemName, list1.itemQuantity.
So very similar to the way we used it before.
In the shopping list controller two, you can see the where likewise
injecting the ShoppingListFactory into the ShoppingListController2.
But this time when we execute the ShoppingListFactory we pass it the max
number of item is this three.
Which means that our shopping list, the local variable,
the shopping list that's referred to the shoppingList service is now going to be
limited to three items only.
So therefore, we need to change our add item method slightly.
We need to make sure that if an error is being thrown from our shoppingList,
that we catch it and do something about it.
Well, that's the tri catch block that you see here that exist in Java Script.
So we're going to try to add the item.
And if the number of items in the shopping list is going to exceed three,
it will throw an error.
In which case, we're going to catch that error.
And we're actually going to set a property on our scope, or really
on the instance of our controller, since we're using the controller as syntax.
That is going to get exposed to our HTML template.
And we're going to set the value of our error message, to error that message.
That is going to come from that error that we threw from this shopping list service.