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

时间:2018-01-08 11:18:46

标签: html css typescript

我已经在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]);
}
&#13;
<!--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>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

困难的部分在你身后!

现在你只需编写一个循环遍历列的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