angularjs 操作二維陣列 加 file檔案繫結
二維陣列遍歷
獲取兩個index 其中 獲取父域裡的index 的方法為: {{$parent.index}} 獲取當前index 的方法為: {{$index}}
注意: 不要用 ng-if 會出現 兩個index 重置成值相同 可以用 ng-show
其中二位陣列需要用到 file 就需要通過一下程式碼 進行值的繫結
<div ng-show="$index==0">
<button type="button" ng-click="addFile($parent.$index,$index)" class="btn btn-primary" >增加行</button>
</div>
<div ng-show="$index>0">
<button type="button" ng-click="deFile($parent.$index,$index)" class="btn btn-primary" >刪除行</button>
</div>
$scope.files=[
[{"fileTitle": "", "fileNum": "", "fileReply": "", "fileTime": "","file":""}],
[{"fileTitle": "", "fileNum": "", "fileReply": "", "fileTime": "","file":""}],
[{"fileTitle": "", "fileNum": "", "fileReply": "", "fileTime": "","file":""}],
[{"fileTitle": "", "fileNum": "", "fileReply": "", "fileTime": "","file":""}],
[{"fileTitle": "", "fileNum": "", "fileReply": "", "fileTime": "","file":""}],
[{"fileTitle": "", "fileNum": "", "fileReply": "", "fileTime": "","file":""}],
[{"fileTitle": "", "fileNum": "", "fileReply": "", "fileTime": "","file":""}],
[{"fileTitle": "", "fileNum": "", "fileReply": "", "fileTime": "","file":""}],
[{"fileTitle": "", "fileNum": "", "fileReply": "", "fileTime": "","file":""}],
[{"fileTitle": "", "fileNum": "", "fileReply": "", "fileTime": "","file":""}],
]
操作二維陣列 :
$scope.deFile = function (index1,index2) {
$scope.indexNumByFile= $scope.indexNumByFile-1;
$scope.files[index1].splice(index2,1);
};
$scope.addFile = function (index1,index2) {
$scope.indexNumByFile= $scope.indexNumByFile+1;
$scope.files[index1].push({});
};
或者 根據 item 判斷 index 值 因為如果用了過濾器 傳入的index 不是實際index值
items.splice(items.indexOf(item),1);
angular 繫結 input 的file檔案:
<div class="form-group">
<input type="file" id="file_{{$index}}" name="file_{{$parent.$index}}" ng-model="fileOneOne.file" class="form-control" onchange="angular.element(this).scope().fileNameChanged(this)">
</div>
$scope.fileNameChanged = function (el) {
var filexx = el.files[0];
var index=el.id.replace('file_','');
var parentIndex=el.name.replace('file_','');
$scope.files[parentIndex][index].file=filexx;
};
相關文章
- perl操作二維陣列陣列
- JavaSE 陣列:一維陣列&二維陣列Java陣列
- 二維陣列陣列
- js 一維陣列轉二維陣列JS陣列
- js 二維陣列轉一維陣列JS陣列
- PHP二維陣列轉一維陣列PHP陣列
- PHP中二維陣列與多維陣列PHP陣列
- JavaScript --二維陣列查詢一維陣列JavaScript陣列
- vector 二維陣列陣列
- Java二維陣列Java陣列
- JavaScript二維陣列JavaScript陣列
- JavaScript 二維陣列JavaScript陣列
- JavaScript二維陣列轉換成一維陣列JavaScript陣列
- C++動態建立二維陣列,二維陣列指標,以及動態二維陣列函式傳遞C++陣列指標函式
- 資料結構之陣列和矩陣--矩陣&不規則二維陣列資料結構陣列矩陣
- C/C++ 二維陣列的理解(多維陣列)C++陣列
- 二維陣列和稀疏陣列互轉陣列
- 二維陣列查詢陣列
- php 二維陣列排序PHP陣列排序
- 二維陣列行排序陣列排序
- 二維陣列傳參陣列
- 二維樹狀陣列陣列
- Java 二維陣列轉一維Java陣列
- 指標陣列和陣列指標與二維陣列指標陣列
- PHP一維陣列轉二維陣列正規表示式PHP陣列
- 7-蛇形二維陣列陣列
- 二維陣列與指標陣列指標
- 二維陣列的計算陣列
- 快速建立空二維陣列陣列
- 二維陣列和指標陣列指標
- JAVA基礎--二維陣列Java陣列
- Java : File 檔案類操作Java
- 求二維陣列中最大子陣列的和陣列
- java之陣列的索引,排序以及二維陣列Java陣列索引排序
- NumPy之:ndarray多維陣列操作陣列
- JavaScript 陣列常見操作 (二)JavaScript陣列
- 繫結Hosts檔案
- c#簡單實現二維陣列和二維陣列列表List<>的轉置C#陣列