Angular2：+演算子の数値型を文字列に変換する

Question

バインディングの '+'演算子が、変数を文字列として連結しているのに対し、 - 、*、/などの算術演算子は、数値として、関連するtypescriptファイルの型です。 voter.component.htmlの

内容voter.component.tsの

<i class="glyphicon glyphicon-menu-up" 
(click)="UpVote()" 
[class.highlighted]="myVote === 1"></i> 

<span class="vote-count">{{ voteCount + myVote }}</span> 

<i class="glyphicon glyphicon-menu-down" 
(click)="DownVote()" 
[class.highlighted]="myVote === -1"></i> 

内容

import { Component, Input } from '@angular/core'; 

@Component({ 
    moduleId: module.id, 
    selector: 'ui-voter', 
    templateUrl: './voter.component.html', 
    styleUrls: ['./voter.component.css'] 
}) 
export class VoterComponent { 

    @Input() voteCount: number; 
    @Input() myVote: number; 

    UpVote() { 
     if (this.myVote === 1) { return; }; 
      this.myVote++; 
    } 

    DownVote() { 
     if (this.myVote === -1) { return; }; 
      this.myVote--; 
    } 
} 

これを使用して、私のapp.component.htmlファイルの行コンポーネント

<ui-voter voteCount="20" myVote="0"></ui-voter> 

Answer 1

二重引用符を使用して値を割り当てると、numberと明示的に指定しても、引用符を削除すると、voteCountとmyVoteはstringと解釈されます。これは動作するはずです：

<ui-voter voteCount=20 myVote=0></ui-voter> 

+オペレータは、2つの文字列をCONCATするために使用することができますが、-、*と/は、文字列を操作することはできませんし、私はそれが混乱を作成したものだと思います。 number型変数に値を代入するときは、常に引用符なしで行う必要があります。