Question

我有一个像这样的数组

[a, b, c, d, e, f, g, h, i]

我的目标是通过 ngFor 遍历它，并按 3 个元素进行拆分，输出应该像这样

  <div class="wrapper">
     <div class="main">abc</div>
     <div class="main">def</div>
     <div class="main">ghi</div>
  </div>

所以我能解决的办法是

<div class="wrapper">
      <div *ngFor="let index = index; let letter of ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i']">
        <div class="main" *ngIf="(index + 1) % 3 == 0">
            {{ letter }}
        </div>
    </div>
</div>

如您所见，我在div上的 main 类上做了div。但是我不需要 main 类div上的任何div。我需要它在示例中的显示方式。

Answer 1

我将在Array函数splice和join的帮助下，使用主数组构造一个新数组，而不是在HTML代码中添加逻辑。

因此，总代码将为：

HTML：

server_socket = socket.socket(socket.AF_INET, socket.SOCK_STREAM)
server_socket.bind((IP, PORT))
server_socket.listen(5)
client_socket, client_address = server_socket.accept()
...
actions = {}
secure_socket = ssl.wrap_socket(client_socket, server_side=True, 
ca_certs="client.pem", certfile="server.pem", keyfile="server.key", 
cert_reqs=ssl.CERT_REQUIRED, ssl_version=ssl.PROTOCOL_TLSv1_2)
actions[secure_socket] = multiprocessing.Process(target=myfunc, args=(arg1, 
arg2))
action[secure_socket].start()

TS代码：

<div class="wrapper">
    <ng-container *ngFor="let index = index; let letter of newArray">
        <div class="main">
            {{ letter }}
        </div>
    </ng-container>
</div>

Stackblitz Demo

角度ngFor按div划分

1 个答案: