AngularJsのCheckBox難問

Question

私の見解では<p>デバッグするためのもので

<input type="checkbox" class="check_box" ng-model="campaign.paused" 
     ng-click="CampaignPauseClicked(campaign, $event)" /> 

<p>campaign.paused == {{campaign.paused}}</p>       

を持っています。それはshoudl、データを所与としては、falseを示しているが、コントローラ

$scope.CampaignPauseClicked = function(campaign, $event) 
{ 
    campaign.paused = ! campaign.paused; 

Iは、最初のコード行にブレークポイントに、campaign.pausedの値はtrueあります（！）。

コードを検索しましたが、campaign.pausedは他の場所には書き込まれていません。

ここで何が起こっている可能性がありますか？

---

[更新]私はそれが$eventを「飲み込む」と親にpropogatingからそれを防ぐために必要があるので、私は、私はそのentirityに示されていないng-click fucntionを、使用しています。

Answer 1

これは、チェックボックスをクリックするとng-modelが値を更新しているからです。あなたはAngularがあなたのためにやっていることを元に戻しています。

$scope.CampaignPauseClicked機能で自分でやりたい場合は、ng-model部分をhtmlから削除してください。

そうでなければ、Angularにそのことをさせ、ng-model="campaign.paused"句を残して、ng-clickコールバックから最初の行を削除することができます。

Answer 2

チェックボックスを使用しているため、ng-clickをng-changeディレクティブに置き換えることもできます。 ng-changeは、チェックボックスの状態が

<input type="checkbox" class="check_box" ng-model="campaign.paused" 
     ng-change="CampaignPauseChanged ($event)" /> 

<p>campaign.paused == {{campaign.paused}}</p> 

そして、あなたのコントローラに（チェック/チェックなし）に変更されるたびに実行されます：

$scope.CampaignPauseChanged = function(event) 
{ 
    console.log(campaign.paused) 
    console.log(event) 
} 

別のオプションは、ここにng-checkeddirectiveだろうこのplunkerの例です。あなたがはっきりとわかるように、チェックボックスモデルは、チェックされている場合にのみtrueを返します。