在HTML页面中解析后如何在源代码中放入行号? [英] How to put line number in source code after parse in HTML page?

查看:63
本文介绍了在HTML页面中解析后如何在源代码中放入行号?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

I am using angular js and mongoDB, In mongoDB I have some text with \n, So each line comes into the new line based on \n, But I am also want to add line number for each line.

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'

预期,我想添加每行的行号.

Expected I want to be add line number of each line.

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

推荐答案

这将对您有所帮助

 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页面中解析后如何在源代码中放入行号?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆