Different way of parsing through value part of key-value pair in AngularJS
Question
I have a key-value pair that looks something like this ($ctrl.displayData)-
143:"/this/is/a/very/long/fil22↵/this/is/a/very/long/file/path.php↵anotherone.php↵newfilel123.php"
It saves file names and when I display it with an ng-repeat, file names are displayed in newlines (just as I want).
For display I use-
<div>
<div id="outputDiv" ng-click="$ctrl.deleteRow(displayData)" ng-repeat="displayData in $ctrl.displayData">{{displayData}}</div>
</div>
The function deleteRow() is pretty basic as of now-
ctrl.deleteRow = function(index){
console.log(index);
}
But when I loop through using ng-repeat, the entire {{displayData}} gets printed in just one iteration, so if I were to call a function like deleteRow() on click of any one file name, it just returns the entire set of file names each time (and not the particular file name that I have clicked on).
Is there a way of looping through $ctrl.displayData in such a way that on clicking any particular file name, the function is called only for that file name.
2 answers
solution1
0 ACCPTED 2018-03-21 19:57:44
could you use javascript split?
// <body ng-app='myApp' binds to the app being created below. var app = angular.module('myApp', []); // Register MyController object to this app app.controller('MyController', ['$scope', MyController]); // We define a simple controller constructor. function MyController($scope) { $scope.files = "/this/is/a/very/long/fil22 \\n /this/is/a/very/long/file/path.php \\n anotherone.php \\n newfilel123.php" $scope.split = function(s) { return s.split('\\n'); } $scope.doStuff = function(d) { console.log(d); } }
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="myApp"> <div ng-controller='MyController'> <p ng-repeat="d in split(files)"> <span ng-click="doStuff(d)">{{d}}</span> </p> </div> </div>
solution2
0 2018-03-26 17:43:52
I handled it inside the JS controller (using split there).
ctrl.arrayList = new Array();
for(var i in ctrl.displayData) {
ctrl.arrayList = ctrl.displayData[i].split('\n');
}
return ctrl.arrayList;
After this I use an ng-repeat on the array ctrl.arrayList for display inside the HTML file.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.