javascript - Angularjs foreach only returns one object -

This can be a bit easier and I'm ignoring it but I'm creating a filter by categories and one Once the user clicks on a category, it updates a scope (my example $ scope.productStuff) and displays the items accordingly. My problem occurs when I click on the category that gives me back the original objects in my console. Then I look at the dom and it shows only all objects in my console instead of one object (and this is the last object) here my job is:

  $ scope.update = function (Val) {angular.forEach ($ scope.productStuff, function (item) {if (item.s2 === val.toUpperCase ()) {$ Scope.productStuff = [item];}}); }  

This is my factory that is receiving data on page load

  dataFactory.getProducts (). Then (function (race) {$ scope.productStuff = Res.data; $ scope.loading = false;});  

So my question is, why is an object displayed in dom and multiple objects in the console, and how do I put items on $ scope.productStuff?

  $ scope.update = function (val) {// an empty array var stuff = [] Create; Angular.forEach ($ scope.productStuff, function) {if (item.s2 === val.toUpperCase ()) {// Push to our array while completing the position (filter) stuff.push (item) ;}}); // $ scope.productStuff now includes all filtered items $ scope.productStuff = stuff; }