angularjs single line json data how to display table format split \r\n

angularjs single line json data how to display table format split \r\n






Hi Today Discussed i handle one task default angularjs single line json data how to display table format split \r\n json data single line json data split \r\n first \r\n table heading <th> tag another table data  <td> followus code.

angularjs single line json data how to display table format split \r\n
angularjs single line json data how to display table format split \r\n

 index.html
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<body>

<div ng-app="myApp" ng-controller="Jsondatadisplay">
    <div class="container">
  
      <br>
        <h3>Data Details:</h3>
        <table class="table table-striped" id="myTable2">
            <thead>
            <tr>
                <th data-ng-repeat="tr in tableHeader track by $index">{{tr}}</th>
            </tr>
            </thead>
            <tr data-ng-repeat="data in tableData track by $index">
                <td data-ng-repeat="col in data track by $index">{{ col }}</td>

            </tr>
        </table>

        <div>

        </div>

        <script>
            var app = angular.module('myApp', []);
            app.controller('Jsondatadisplay', function ($scope, $http) {
            
                $http
                    .get("data.json")
                    .then(function (res) {
                        var dataToParse = res.data.Data;
                        var replaced = dataToParse.split("\r\n");
                        $scope.tableHeader = replaced[1].split(",");
                        var tempArray = [];
                        angular.forEach(replaced, function (element) {
                            tempArray.push(element.split(","));
                        });

                        delete tempArray[0];
                        delete tempArray[1];
                        $scope.tableData = tempArray;
                    })
            });
        </script>

</body>
</html>
data.json

json data very largest json data so please click github link and download file Click Here

output Click Here

angularjs single line json data how to display table format split \r\n Dev2Tricks 5 of 5
angularjs single line json data how to display table format split \r\n Hi Today Discussed i handle one task default angularjs si...

Share this

Related Posts

Previous
Next Post »

1 comments:

comments
21 January 2023 at 18:34 delete

One such provide is the welcome bonus that provides Korean gamers a hundred and fifty free spins and goes a lot as} $150, which in the long run|the long term} will increase the potential payout. Currency purchased in-game can't be used for betting in slot video games - solely secondary cash earned from other video games such as Poker and Go-Stop. Auto-betting just isn't allowed, customers are not allowed to ask their friends into the game in PvP video games 온라인카지노 such as Poker and Go-Stop for fraud prevention and the system ought to automatically match the random gamers. Secondly, most Korean people - including those that are in charge of|in command of|in management of} national policy - generally tend to assume that more people will suffer from playing dependancy if rules for on-line playing are relaxed.

Reply
avatar