md-sliderの値にangle-2をバインドする方法

Question

私はAngular 2.0/meteorでアプリケーションを開発していますが、入力をmd-sliderにバインドする方法はわかりません。

は、ここでコンポーネントのhtmlです：これは動作しません

import {Component, ViewEncapsulation, OnInit, NgZone, Input} from '@angular/core'; 
import { Router } from '@angular/router'; 
import { Meteor } from 'meteor/meteor'; 
import { Observable } from 'rxjs'; 
import { FormBuilder, FormGroup, Validators } from '@angular/forms'; 

//Collection import 
import { Filtres } from '../../../../both/collections/filtres.collection'; 
import {Filtre} from "../../../../both/models/filtre.model"; 

import template from './tpl.dashboard.component.html'; 


@Component({ 
    selector: 'traitement_par_lot', 
    encapsulation: ViewEncapsulation.None, 
    template 
}) 

export class TPLcomponent implements OnInit{ 

    filtres: Observable<Filtre[]>;  
    filtreForm: FormGroup; 

    constructor(
    private formBuilder: FormBuilder, private router: Router 
) {} 

    ngOnInit(){ 
    this.filtreForm = this.formBuilder.group({ 
     spread:['',Validators.required], 
     density:['',Validators.required], 
     curviness:['',Validators.required], 
     reseed:['',Validators.required], 
    }); 

    this.filtres = Filtres.find({}).zone(); 
    console.log(this.filtres); 
    } 

    appliquerFiltre(){ 

    } 

} 

：

<div class="panel-body"> 
    <form [formGroup]="filtreForm" #f="ngForm"> 
    <span class="panel-title"> <i class="glyphicon glyphicon-retweet"> Paramétrages 0 </i></span> 
    <md-slide-toggle>On</md-slide-toggle> 
     <div *ngFor="let filtre of filtres | async"> 
      <div *ngFor="let filtr of filtre.arguments"> 
      <span class="panel-title" > <i class="glyphicon glyphicon-retweet"> {{filtr.name}} </i></span> 

      <md-input-container class="example-full-width" > 
       <input mdInput placeholder="{{filtr.name}}" formControlName="{{filtr.name}}" value="{{filtr.value}}"> 
       </md-input-container>              
      <md-slider 
      thumb-label 
      [min]="'0'" 
      [max]="'200'" 
      [value]="filtr.value">   
      </md-slider> 
      </div> 
     </div> 

    <div class="btn-group people-pager"> 
     <button type="button" class="btn btn-success btn-quirk" (click)="appliquerFiltre()"><i class="fa fa-tencent-weibo Try it"></i> Appliquer ce filtre</button> 
    </div> 
    </form> 
    </div> 

は、ここでコンポーネントTSです。今の私は、スライダからの初期値を得ることができますが、私はslideringながら、あなたはmd-sliderのchangeまたはinputイベントを使用し、取得することができ、更新のために、事前

Answer 1

で

おかげ値をスライドさせたとき、それは変更されませんですその現在の値はevent.valueです。

• 変更イベントはスライドの終了後にのみ発生します。
• 入力イベントは、スライダーの値が

を変更した場合、あなたの状況に、より良いものを選ぶことができ、すぐに解雇されます。 これを見てくださいplunker。