Question

我正在使用angular js和mongoDB，在mongoDB中我有一些带\ n的文本，因此每行都基于\ n进入新行，但是我还想为每行添加行号。

HTML代码

{{sorceText}}

控制器代码

 $scope.sorceText=" ANB+IO:UI+OPO++7866:1111222'\OKP+JJJJ+PP++IOOIO:9989+KKKKKK+II+22:33'
 IIOI+IOIOOI+OOOO:13:1:IA+AA346+4'
 MSG+8'
 LLL+PLPL:MLML+52519950'
 NBK+290818:0000+MJL+LKL+OK+91'
 KWNN+250'
 NFR'
 KK+KK:MMM'"

立即显示：

     ANB+IO:UI+OPO++7866:1111222'\OKP+JJJJ+PP++IOOIO:9989+KKKKKK+II+22:33'
     IIOI+IOIOOI+OOOO:13:1:IA+AA346+4'
     MSG+8'
     LLL+PLPL:MLML+52519950'
     NBK+290818:0000+MJL+LKL+OK+91'
     KWNN+250'
     NFR'
     KK+KK:MMM'

预期，我想添加每行的行号。

ANB + IO：UI + OPO ++ 7866：1111222'\ OKP + JJJJ + PP ++ IOOIO：9989 + KKKKKK + II + 22：33'
IIOI + IOIOOI + OOOO：13：1：IA + AA346 + 4'
MSG + 8'
LLL + PLPL：MLML + 52519950'
NBK + 290818：0000 + MJL + LKL + OK + 91'
KWNN + 250'
NFR'
KK + KK：MMM'

Answer 1

使用ol

See working code

在js中拆分为该字符串的数组。

$scope.items=$scope.sorceText.split('\n');

在此数组的html中使用循环：

<ol>
  <li ng-repeat="item in items">{{item}}</li>
</ol>

Answer 2

对您有帮助

 var app=angular.module('myapp',[]);
 app.controller("myctrl",function($scope){
 $scope.sorceText="ANB+IO:UI+OPO++7866:1111222'\OKP+JJJJ+PP++IOOIO:9989+KKKKKK+II+22:33'\nIIOI+IOIOOI+OOOO:13:1:IA+AA346+4'\nMSG+8'\nLLL+PLPL:MLML+52519950'\nNBK+290818:0000+MJL+LKL+OK+91'\nKWNN+250'\nNFR'\nKK+KK:MMM'"
 
 $scope.sorceText_arr=[];
 var arr=$scope.sorceText.split("\n");
 $scope.sorceText_arr=arr;
 })

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>

<div ng-app="myapp" ng-controller="myctrl">
         <div ng-repeat="i in sorceText_arr">
         <div>{{$index+1}} - {{i}}</div>
         </div>
</div>

在HTML页面中解析后，如何在源代码中放入行号？

2 个答案: