角滑塊沒有顯示

我在我的網站上實現了一個角滑塊，我有問題，它沒有顯示出來。在控制檯中沒有報告錯誤。角滑塊沒有顯示

我實現了這種方式：

的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

角滑塊沒有顯示

回答

相關問題