How to KEEP only what was filtered in Angularjs?

Question

I have the following Angularjs file:

<script>
    angular.module('meuModulo', [])

        .controller('mercadoriaCarrinho', function($scope, $http) {
            var ctrl = this;
            $scope.listademercadoria = [];
            $scope.listaDoCarrinho = [];
            $scope.listo = [];
            $scope.showPanel = true;
            $scope.total = 1;
            $scope.moeda = null;

            $scope.mercadoria0 = {
                id: 'id1',
                setor: 'alimento',
                foto: 'foto1',
                descr: 'descr1',
                de: de1,
                por: por1,
                mercadoria: '0',
                quantidade: 0,
                total: 5
            }
            $scope.listademercadoria.push($scope.mercadoria0);

           $scope.mercadoria1 = {
                id: 'id2',
                setor: 'sobremesa',
                foto: 'foto2',
                descr: 'descr2',
                de: de2,
                por: por2,
                mercadoria: '0',
                quantidade: 0,
                total: 5
            }
            $scope.listademercadoria.push($scope.mercadoria1);

            $scope.filtrarSetor = function(zSetor) {
                $scope.listaMercadoriaNova = $scope.listademercadoria.filter(
                    function(mercadoria) {
                        return mercadoria.setor != zSetor;
                    });

                $scope.listademercadoria = $scope.listaMercadoriaNova;
            }
        });
</script>

HTML code:

<div class="body" ng-controller="mercadoriaCarrinho">
    <ul class="kbtg-departamentos-menu" role="toolbar">
        <li><span>Página inicial</span></li>
        <li ng-click="filtrarSetor('alimento'); "><span>Alimentos</span></li>
        <li ng-click="filtrarSetor('sobremesa'); "><span>Sobremesas</span></li>
    </ul>


<div ng-repeat = "mercadoria in listademercadoria" class="swiper-slide">
{{mercadoria.descr}}</div>

</div>

The problem is that it excludes all filtered items, and I need to KEEP only filtered items.

Does anyone have any idea how to do?

I’ve tried to reverse the equality signs, use the ". pop", $scope.listademercadoria = $scope.listademercadoria - $scope.listaMercadoriaNova;, etc....

Note: ng-repeat and other Angularjs functions are working normally.

Answer 1

You are ordering to display all items different from the amount you received.

Change this line:

return mercadoria.setor != zSetor;

To:

return mercadoria.setor === zSetor;