如何获取 ng-repeat 的 ElementById 内容？

Question

如何获取ng-repeat的内容？

<div ng-repeat="w in quick.wint">
   <div id="wname"><strong>{{w.Name}}</strong></div>
   <div id="wcount">{{w.Count}} Open Queues</div>
</div>

我想将它们分配给打印文档的变量

var wname = document.getElementById('wname').innerHTML;
var wcount = document.getElementById('wcount').innerHTML;
var popupWin =window.open('','_blank','width=300,height=300');
popupWin.document.open();
popupWin.document.write('<html><head><link rel="stylesheet" type="text/css" href="style.css" /></head><body onload="window.print()"><h1>Documentation</h1>' + wname + '</body></html>');
popupWin.document.close();

我想在文档中采用不同于在浏览器中显示的格式。因此，例如它在浏览器中显示为：

<wname>
<wcount>

我希望它在文档中显示为：

<wname> : <wcount>

提前致谢。

Answer 1

您可以像这样在每个 id 上附加索引：

<div ng-repeat="w in quick.wint; let i = index">
   <div id="wname-{{i}}"><strong>{{w.Name}}</strong></div>
   <div id="wcount-{{i}}">{{w.Count}} Open Queues</div>
</div>

所以如果你想抓取特定的行，你可以通过连接的 id 来调用它：

var wname = document.getElementById('wname-1').innerHTML;
var wcount = document.getElementById('wcount-1').innerHTML;

但如果您想要所有内容，那么也许您应该使用 class 并使用 querySelectorAll - 获取子项数组？

<div ng-repeat="w in quick.wint">
   <div class="wname"><strong>{{w.Name}}</strong></div>
   <div class="wcount">{{w.Count}} Open Queues</div>
</div>

const wnames = document.querySelectorAll(".wname")
const wcounts = document.querySelectorAll(".wcount")

https://developer.mozilla.org/en-US/docs/Web/API/Element/querySelectorAll

如何获取 ng-repeat 的 ElementById 内容？

How to getElementById contents of ng-repeat?

javascript

angularjs