角度のある素材を変更する方法コードから進捗バーの値を変更する

Question

角度コードのプログレスバー値をコンポーネントコードから変更しようとしています。 バインディングを使用せずに値を変更する必要があります。

以下のロジックは通常、テキスト入力のようなhtmlcontrolsで動作します。 しかし、プログレスバーでは動作しません。

HTML：

<md-progress-bar mode="determinate" 
    id="progressBar" name="progressBar" #progressBar></md-progress-bar> 
<button (click)="test()">Test</button> 

コード：

@ViewChild('progressBar') progressBar: any; 
test() { 
this.progressBar.value = "15"; 
} 

Answer 1

限りchangedetectorソリューションのおかげで、アンダーこれはOnPushに関連していますが、今は動作します。しかし、再びバインディングを使用するように変換する必要がありました。だから、基本的にチェンジ検出器とバインディングは一緒にうまく動作します。あなたはバインディングを使用せずに値を変更する必要がありますなぜ

<md-progress-bar mode="determinate" [value]="percentage" style="width:70%;" 
id="progressBar" name="progressBar" #progressBar></md-progress-bar> 

    url: string; 
    lastSigResult: SigResult; 
    @ViewChild('lastSigResultSpan') lastSigResultSpan: any; 
    percentage:string = ""; 
    message:string = ""; 

    constructor(private changeDetector: ChangeDetectorRef,private route: ActivatedRoute, private router: Router, private signalRService: SignalRService) { 
     this.route.params.subscribe(
      params => { 
       console.log(params); 
       if (params['url']) { // Eğer url boş değilse 
        this.url = params['url']; 
       } 
      } 
     ); 

     this.subscribeSignalREvents(); 
    } 

    private subscribeSignalREvents(): void { 
     this.signalRService.connectionEstablished.subscribe(() => { 
      console.log("Connected to signalr..."); 
     }); 
     this.signalRService.messageReceived.subscribe((result: SigResult) => { 
      console.log(result); 
      // debugger; 
      this.changeDetector.markForCheck(); 
      this.lastSigResult = result; 
      this.lastSigResultSpan.nativeElement.value = result.Message; 
      this.message = result.Message; 
      this.percentage = result.Percentage; 
      this.changeDetector.detectChanges(); 
     }); 
    } 

Answer 2

値は、ProgressBarの番号でなければなりません：

this.progressBar.value = 15;