Question

我正在处理一个问题。我已经在我的角度应用程序中测试了反应式表单模块演示（请参见https://angular-slider.github.io/ng5-slider/demos）。一切工作正常，除了拖动时表单控件值不会像演示示例中那样更新。我必须释放滑块指针才能更新表单控件的值。

我目前正在使用该角conf：

“依赖项”：{“ @ angular / animations”：“〜7.0.0”，“ @ angular / common”： “〜7.0.0”，“ @ angular / compiler”：“〜7.0.0”，“ @ angular / core”：“〜7.0.0”， “ @ angular / forms”：“〜7.0.0”，“ @ angular / http”：“〜7.0.0”， “ @ angular / platform-browser”：“〜7.0.0”， “ @ angular / platform-browser-dynamic”：“〜7.0.0”，“ @ angular / router”： “〜7.0.0”，“ @ ng-bootstrap / ng-bootstrap”：“ ^ 4.0.0”， “ angular2-loaders-css”：“ ^ 2.0.1”，“ angular2-moment”：“ ^ 1.9.0”， “ bootstrap”：“ ^ 4.1.3”，“ core-js”：“ ^ 2.5.4”，“ ng5-slider”：“ ^ 1.1.13”， “ ngx-cookie-service”：“ ^ 2.0.0”，“ rxjs”：“〜6.3.3”，“ zone.js”：“〜0.8.26” }

这是surcout.component.html文件：

      <form [formGroup]="repartitionRemplacementsForm">
          <div class="row mb-3 pl-5 pr-5 align-items-baseline d-flex" *ngFor="let remplacement of remplacements">
            <div class="col-3">
              <div class="row">
                <div class="col mx-auto">
                  <img class="img-csp surcout-repartition" [src]='remplacement.imgCsp'>
                </div>
              </div>
              <div class="row">
                <div class="col mx-auto">
                  <span class="csp-poste">{{remplacement.csp}}</span>
                </div>
              </div>
            </div>
            <div class="col-9 text-center">
              <div class="row mb-0 solution-header indicateurs">
                <div class="col-6 title cdd"><p>{{repartitionRemplacementsForm.controls[remplacement.csp].value}}%</p></div>
                <div class="col-6 interim-sous-traitance title"><p>{{100-repartitionRemplacementsForm.controls[remplacement.csp].value}}%</p></div>
              </div>
              <div class="row">
                <div class="col">
                  <ng5-slider [options]="options" [formControlName]="remplacement.csp" class="simple-slider"></ng5-slider>
                </div>
              </div>
            </div>
          </div>
        </form>

这是我如何在surcout.component.ts中初始化滑块的选项：

options: Options = {
floor: 0,
ceil: 100,
step: 5,
hideLimitLabels: true,
hidePointerLabels: true,
showSelectionBarFromValue: -10};

如果有人可以测试它是否可以正常工作，那就太好了！

谢谢

拖动时ng5-slider不会更新表单控件值

0 个答案: