Question

我有一个范围滑块，用于过滤产品。它在codepen中运行得非常好，但是当我将其移动到我的大型产品时，它不会滑动并且会在其下方的所有count上破坏我的<divs>代码。这是产品的codepen。

我正在使用Rzajac's range slider here。

HTML

  <rzslider
        rz-slider-floor="priceSlider.floor"
        rz-slider-ceil="priceSlider.ceil"
        rz-slider-model="priceSlider.min"
        rz-slider-high="priceSlider.max"
        rz-slider-step="{{priceSlider.step}}"></rzslider>

角

var app = angular.module('plunker', ['rzModule']);

app.controller('MainCtrl', function($scope) {

  $scope.priceSlider = {
    min: 0,
    max: 20,
    ceil: 20,
    floor: 0,
    step: 1
  };  

$scope.products = [
        {
            name: 'one',
                        height: '00'
                    },
          {
            name: 'two',
                        height: '10'
                    },
          {
            name: 'three',
                        height: '20'
                    }
  ];

  $scope.minFilter = function (p) {
        return p.height >= $scope.priceSlider.min;
    };

   $scope.maxFilter = function (p) {
        return p.height <= $scope.priceSlider.max;
    };
});

滑块位于“SIZE”标签中，感谢帮助人员！

Answer 1

你在第一个Codepen中使用Angular 1.2.4，在第二个中使用Angular 1.0.7。年龄较大的Angular抱怨说它不明白你的指令：

Error: Invalid isolate scope definition for directive rzslider: =?

AngularJS代码在一个代码集中工作，但在移动时中断

1 个答案: