小编Ner*_*erg的帖子

Angular2与Jquery-ui滑块

我尝试使用带有angular2的Jquery-ui滑块.我想让变量"slideValue"显示滑块的值,但我无法弄清楚如何将我的模型或变量从角度绑定到滑块.这是我的滑块组件:

import {Component, ElementRef, Inject, OnInit} from 'angular2/core';

declare var jQuery:any;

@Component({
    selector: 'slider',
    template: 
    `
    <input type="text" [(ngModel)]="slideValue" id="amount" required placeholder="Enter a name here">
    <div id="slider"></div>
    <h2>slideValue = {{slideValue}}</h2>
    `
})

export class Slider implements OnInit {
    elementRef: ElementRef;
    slideValue: number;

    constructor(@Inject(ElementRef) elementRef: ElementRef) {
        this.elementRef = elementRef;
    }

    ngOnInit() {        
        jQuery(this.elementRef.nativeElement).find("#slider").slider({
          range: false,
          orientation: "vertical",
          min: 0,
          max: 100,
          value: 60,
          slide: function( event, ui ) {
            this.slideValue = ui.value; //doesn't seem to work
            $( "#amount" ).val( ui.value …
Run Code Online (Sandbox Code Playgroud)

javascript jquery-ui angular

7
推荐指数
1
解决办法
6309
查看次数

标签 统计

angular ×1

javascript ×1

jquery-ui ×1