Solucionado (ver solução)
Solucionado
(ver solução)
3
respostas

filtro com operador OR

Estou tentando construir um filtro a partir de um Range Slider.

Seria possível definir que quando meu range slider estiver em uma das posições, eu consiga mostrar mais de uma categoria?

com o código abaixo eu consigo filtrar usando o range, mas ele só filtra pela primeira palavra, o operador não funciona.

 $scope.filtroRange = filtroRange;

    function filtroRange() {
        if (this.rangemodel == 1) {
            $scope.filtrocategoria = 'site' || 'ecommerce ';            // algo desse tipo!
        } else if(this.rangemodel == 2) {
            $scope.filtrocategoria = 'branding' || 'vídeo';          // algo desse tipo!
        } ;
    }

<div ng-repeat="projeto in projetos | filter: {categoria: filtrocategoria}">

3 respostas

Fala Mauricio, tudo bom?

this.rangemodel, faz referencia a função filtroRange, onde ele foi criado? pode compartilhar mais trechos do codigo?

Aqui está meu controller e meu HTML dessa parte da view.

angular.module('2ml').controller('PrincipalController', function($scope, recursoProjeto, $routeParams) {

    $scope.projetos = [];

    $scope.filtroRange = filtroRange;

    function filtroRange() {
        if (this.rangemodel == 1) {
            $scope.filtrocategoria = 'site' || 'ecommerce';
            console.log('filtrando site + email + vídeo');
        } else if (this.rangemodel == 2) {
            $scope.filtrocategoria = 'branding' || 'vídeo';
            console.log('filtrando branding + vídeo');
        } ;
    };

    recursoProjeto.query(function(projetos) {
        $scope.projetos = projetos;
    }, function(erro) {
        console.log(erro);
    });
});
           <div class="row">
                <div class="range-slider col-md-12">
              <input ng-model="rangemodel" type="range" value="4" id="slide" class="input-range" name="mySlider" min="1" max="7" ng-change="filtroRange()"/>
            </div>
            </div>
            <div class="projects-wrapper">
                <div class="row">
                    <a class="col-md-3 col-lg-3 col-sm-6 col-xs-12 " ng-repeat="projeto in projetos | filter: {categoria: filtrocategoria}" href="/#/portfolio/{{projeto._id}}">
                        <div class="project-button">
                            <img src="{{projeto.thumbnail}}" class="img-fluid" style="width: 100%; height: auto;">
                        </div>
                    </a>
                </div>
            </div>
solução!

Consegui resolver dessa forma:

```$scope.projetos = [];

$scope.filtroRange = filtroRange;

function filtroRange() { if (this.rangemodel == 1) { $scope.categoryFilter = function(projeto) { if (projeto.categoria === 'site institucional' || projeto.categoria === 'ecommerce') { console.log('filtrando'); return projeto; } }; } else if (this.rangemodel == 2) { $scope.categoryFilter = function(projeto) { if (projeto.categoria === 'branding' || projeto.categoria === 'email marketing') { console.log('filtrando'); return projeto; } }; } };```