はNG-繰り返しボタンの機能を起動しようとすると、私は一つのボタンをクリックすると機能が

Question

HTMLテンプレートenableInput（）はすべてNG-繰り返しボタンでトリガを受けるすべてのNG-繰り返しボタン、上のトリガを取得

<md-card ng-repeat="item in vm.feeCard | orderBy:'$index':true"> 
     <div flex layout="column"> 
      <div layout layout-align="space-between center"> 
     <md-input-container > 
     <input name="feename" ng-model="item.name" placeholder="Fee Name" ng-readonly="vm.defaultReadonly" /> 
     </md-input-container> 
     <md-input-container > 

     <input name="amount" ng-model="item.amount" placeholder="$ Amount" ng-readonly="vm.defaultReadonly" /> 
     </md-input-container> 
    </div> 

<md-button class="md-primary md-raised" ng-click="vm.enableEditing()">Edit</md-button> >these repeated buttons triggered when i click one of them 
    </div> 
</md-card> 

するコントローラ

（関数（）{ 'は厳密使用'; 角度.module（ 'app.admin'） .controller（ 'schoolFeeCtrl'、schoolFeeCtrl）;

（）;

}）（）;

Answer 1

理由：あなたは、共有変数はすべてのために同じであるng-repeat内のすべての要素を更新するために、同じ機能を使用しているので、我々はそれらのすべてを編集することができますので

！

ソリューション：

はここソリューションの2つのバージョンです。

ng-repeatで使用されているソース配列にreadonly変数を付加します。 JSFiddleの下にあなたは私がng-readonly="item.defaultReadOnly"を変更しています見ることができて

ので、我々はソースアレイにdefaultReadOnlyと呼ばれる新しい変数を取り付け、その後、私たちが行う必要があるすべては、私は内部のdiv要素の一方に取り付けられているng-init="item.defaultReadOnly = true;"を使用して、この値を初期化していますng-repeat、ボタン上にはng-click="item.defaultReadOnly = false;"とすることができます。これにより、読み取り専用プロパティが無効になり、入力を編集することができます。

JSFiddle Demo

は、このように私たちのソース配列構造が保存され、ダミー配列に読み取り専用変数を設定します！我々は代わり item.defaultReadOnlyを使用する我々は別の変数vm.tempを使用する唯一の変化を行うJSfiddle下に、今我々はng-repeatの異なる要素を区別することができ、しかし、vm.temp[$index]ように、従って各要素を設定値に

ng-repeatは vm.tempに別の配列要素を持ちます。上記の説明はこの例にも当てはまり、変数名だけが変更されます！

JSFiddle Demo