角滑块没有显示

我在我的网站上实现了一个角滑块，我有问题，它没有显示出来。在控制台中没有报告错误。角滑块没有显示

我实现了这种方式：

的index.html

<script src="/../bower_components/angular/angular.js"></script> 
    <script src="/../bower_components/angularjs- 
     slider/dist/rzslider.min.js"></script> 
    ... 
    <body ng-controller="ctrl"> 
    <div class="container"> 
    <div class="col-md-9"> 
    <p>Date Range:</p><br> 
      <rzslider class="custom-slider" 
      rz-slider-model="dateSlider.minValue" 
      rz-slider-high="dateSlider.maxValue" 
      rz-slider-options="dateSlider.options"></rzslider> 
    ...

而且控制器：

angular.module('myapp', []).controller('ctrl', 
function($scope, $http, $rootScope, gservice){ 
$scope.dateSlider = { 
     minValue: '1', 
     maxValue: '4', 
     options: { 
      stepsArray: [1, 2, 3, 4] 
     } 
    }; 
    }

我app.js：

var app = angular.module('myapp', ['ctrl', 'gservice', 'rzModule']);

这是什么原因？

来源

2017-06-02 ffritz

您是否包含滑块库JS文件并注入它？ – Tushar

@Tushar是的，上面更新了。 – ffritz

@ffritz：你包括'rzModule'模块吗？，像'angular.module（'myapp'，['rzModule']）;'？，看[fiddle]（http://jsfiddle.net/3jjye1cL/） – anoop

你需要纠正我们module declaration和注册controller\service\factory.

在上面的代码的方式，删除空的依赖[]，否则它会创建新的模块。重用像现有的申报模块：

angular.module('myapp').controller('ctrl', 
function($scope, $http, $rootScope, gservice){ 
$scope.dateSlider = { 
     minValue: '1', 
     maxValue: '4', 
     options: { 
      stepsArray: [1, 2, 3, 4] 
     } 
    }; 
    },

和模块依赖数组中删除ctrl, gservice，像：

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

如，你可以与现有的模块myapp

进一步注册控制器\服务gservice，似乎是一些service，也可以注册到现有模块，如：

angular.module('myapp').service('gservice', function(\\

来源

2017-06-02 07:56:29 anoop

我想你可能已经忘记了链接rzslider.css和UI的自举tpls.js。您可能还需要在HTML中定义ng-app。 <link rel='stylesheet' href='https://rawgit.com/rzajac/angularjs-slider/master/dist/rzslider.css'> <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.14.3/ui-bootstrap-tpls.js"></script>

您可以在jsfiddle中看到我测试代码的实时代码。

https://jsfiddle.net/abhijd88/2eupcen8/6/

来源

2017-06-02 09:13:19

角滑块没有显示

回答

相关问题