2016-05-02 14 views
0

私のアプリケーションでJQueryスライダを使用しようとしていますが、JQueryだけで試してみるとうまくいきますが、typescriptで作成したangleディレクティブで使用すると、このように表示されます。ここではtypescript angleディレクティブのJQueryスライダが正しく表示されない(C#)

enter image description here

はディレクティブです:

SliderDirective.$inject = ["$window"]; 

function SliderDirective($window: ng.IWindowService): IMediaDirective { 
    return { 
     restrict: "EA", 
     link: link 
    } 

    function link(scope: IMediaDirectiveScope, element: ng.IAugmentedJQuery, attrs: IMediaDirectiveAttributes) { 
     element.slider({ 
      range: true, 
      min: 10, 
      max: 100, 
      value: 50, 
      slide: (event: Event, ui: JQueryUI.SliderUIParams) => { 
       scope.$apply(function() { 
        scope[attrs.ngModel] = ui.value; 
       }); 
      } 
     }) 
    } 
} 

angular.module("mediaApp").directive("slider", SliderDirective); 

HTMLテンプレート:

​​

他の指令は、必要なように機能しています。また、私はVS 2015、jqueryui.d.tsとangular.d.tsをDefinitelyTypedから使用しています

ありがとうございました!

答えて

1

[OK]私は問題を発見し、それは本当に愚かです。このへ

<input ng-model="slider" type="text" id="amount" readonly style="border:0; color:#f6931f; font-weight:bold;"> 
<slider ng-model="slider"></slider> 

:私はこれを変更しなければならなかった

<input ng-model="slider" type="text" id="amount" readonly style="border:0; color:#f6931f; font-weight:bold;"> 
<div slider ng-model="slider"></div> 

そしてそれは奇跡のように働きました。なぜ誰かが私に教えてもらえますか?

関連する問題