他のすべてを削除し、クリック時にチェックマークを追加する

私はこのようなボタンとNGリピートあります。私はこのフィルタを発見した他のすべてを削除し、クリック時にチェックマークを追加する

<div data-ng-repeat="department in departments_array"> 
    <div class="row"> 
     <div class="col-md-6 dslc-button-wrapper"> 
      <button class="btn btn-default btn-block">Show on Map {{ 1 | checkmark }}</button> 
     </div> 
    </div> 
</div>

、私は、チェックボックスを表示するために使用したいとき選択した要素がクリックされたと同時に、他のNG-リピートボタンから他のすべてのチェックマークを削除している：私はどのように知っているように、私は多くの方法として試した

angular.module('Filters', []).filter('checkmark', function() { 
    return function(input) { 
    return input ? '\u2713' : ''; 
    }; 
});

が、私は終わることができました一度に1つの要素に対してチェックマークを追加または削除することができます。

すべてのヘルプは大

おかげ

出典

2016-03-29 Gerard Simpson

個人的に私はこれを行うには、フィルタを使用しないことをいただければ幸いです。これは、ビュー内の状態を管理する正しい方法ではありません。コントローラ上の変数は、一般的で読み取り可能なソリューションです。 Plunkerして、以下のソリューション：

controller.js

myApp.controller('myController', function() { 
    var self = this; 
    self.departments_array = ['dept A', 'dept B', 'dept C']; 
    self.selected_dept = undefined; 
});

index.htmlを

<body ng-app="my-app"> 
    <div ng-controller="myController as mc"> 
     <div data-ng-repeat="department in mc.departments_array"> 
      <div class="row"> 
       <div class="col-md-6 dslc-button-wrapper"> 
        <button ng-click="mc.selected=department" class="btn btn-default btn-block"> 
        Show on Map <span ng-show="mc.selected===department">&#10003;</span></button> 
       </div> 
      </div> 
     </div> 
    </div> 
    </body>

出典

2016-03-29 04:30:49

私はこのコードがどのように動作するかわかりませんが、私はで$スコープを使用して使用しています私のコントローラ。展開するか、$ scopeを使ってこれを適用するのを助けてください。 –

コントローラーを構文として使用しています。 Plunkerをチェックしてください。基本的にはコントローラが宣言されたときに、それを '' ng-controller = "myController as mc" ''として宣言するということだけです。そして、すべての子スコープ変数の先頭にmcが付きます。コントローラに何かこれを追加します。 $スコープを行う古い方法と同じです。 –

このプランナーを見ていただけますか？私はまだそれを働かせることができません： https://plnkr.co/edit/TNp6N5yBuee5sUeR295h?p=preview –

他のすべてを削除し、クリック時にチェックマークを追加する

答えて

関連する問題