html - 如何在 HTML 中使用 typescript 以表格格式插入数组元素

Question

我在 typescript 中写了一个插入排序的代码，我在 html 页面中得到了值..

我的问题是我想将它们显示为带有排序值的表格。

动态地应该通过获取数组的长度来创建列..

请帮帮我......

<!--app.component.ts-->

enter code here
import {
  Component
} from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'app';
  numericArray: Array < number > = [1, 2, 6, 9, 13, 25, 100, 22, 76, 222];
  sorrtedArray: Array < number > = this.numericArray.sort((n1, n2) => n1 - n2);


  insertion_Sort(arr) {
    for (var i = 1; i < arr.length; i++) {
      if (arr[i] < arr[0]) {
        //move current element to the first position
        arr.unshift(arr.splice(i, 1)[0]);
      } else if (arr[i] > arr[i - 1]) {
        //leave current element where it is
        continue;
      } else {
        //find where element should go
        for (var j = 1; j < i; j++) {
          if (arr[i] > arr[j - 1] && arr[i] < arr[j]) {
            //move element
            arr.splice(j, 0, arr.splice(i, 1)[0]);

          }
        }
      }
    }
    return arr;
  }
  result = this.insertion_Sort([1, -2, 6, 90, 13, 25, 100, 22, 76, 222]);
}

<!--app.component.html-->



<!--The content below is only a placeholder and can be replaced.-->
<div style="text-align:center">
  <h1>
    Welcome to {{ title }}!
  </h1>
</div>
<table>
  <div class="container">
    <div class="row">
      <div class="col-xs-12">
        {{result}}
      </div>
    </div>
  </div>
</table>

Answer 1

困难的部分已经过去了!

现在你只需要写一个for遍历列(从 1 到给定数组的长度)的循环，每次迭代打印 <TD>里面有当前元素。像这样:

var array = [1,2,3];  // As an example

var ans = "<TABLE><TR>";
for(i=0; i<array.length; i++) {
    ans += "<TD>" + array[i] + "</TD>";
}
ans += "</TR></TABLE>"

document.write(ans);  // Or return it, depends on your specific need