Question

我正在使用 AngularJS v1.3.0 和 Foundation 5.0.3 对应用程序进行编码。在我的一个页面中，我有一些字段集，每个字段集包含一些range sliders。像这样的东西

<fieldset ng-repeat="element in list" id="element_{{element.ID}}">
  <legend>Element: {{element.name}}</legend>
  <div ng-repeat="subelement in element.list" id="subelement_{{subelement.ID}}">
    <div class="small-10 medium-11 columns">
      <div class="range-slider round" data-slider="50">
        <span class="range-slider-handle"></span>
        <span class="range-slider-active-segment"></span>
      </div>
    </div>
  </div>
</fieldset>

问题是在我打开浏览器控制台之前我无法移动滑块。它发生在Firefox和Chrome中。我猜AngularJS在浏览器中激活调试模式时定义了一些变量，这会导致问题。但我真的不知道......

任何线索？

非常感谢提前

Answer 1

尝试将此运行功能添加到角度应用。

.run(function($rootScope) {
    $rootScope.$on('$viewContentLoaded', function () {
        $(document).foundation();
    });
});

Answer 2

虽然它还没有范围滑块，但是如果你使用带有基础的角度，你应该看看这个：http://pineconellc.github.io/angular-foundation/

Answer 3

Angular的基础范围滑块端口https://github.com/fulup-bzh/RangeSlider

基础范围滑块仅在启动浏览器控制台后才能工作

3 个答案: