Angular 2 CreateElement

时间:2017-01-16 08:17:59

标签: angular

我正在尝试在TypeScript中使用document.createelement语句,但直到现在我才能找到解决此问题的方法,有一种方法可以创建此函数。

这是组件

import {Component,ViewChild, ElementRef} from '@angular/core';
@Component({

selector: 'my-Calc',
  templateUrl:'./app/Calculator/calculator.component.html'
})
export class Calculator{
  tablerow:[1,2,3];
  calcItems :[1,2,3,4,5,6,7,8,9];
}

这是我的html模板

<div>
  <table *ngFor="let tRow of tablerow">
<tr *ngFor=" let tItems of tablerow">
  {{tRow}}<td >{{tItems}}</td>
</tr>
  </table>
</div>

我想在我创建的每个表格框中创建一个按钮元素 顺便说一下,这不是完整的代码并感谢您的帮助

2 个答案:

答案 0 :(得分:1)

语法错误&#34; document.createelement&#34; &#39; E&#39;应该是大写字母。

正确的:

<div>
      <table *ngFor="let tRow of tablerow">
         <tr *ngFor=" let tItems of tablerow"><
          {{tRow}}<td ><form><input type=submit value="click me"></form>{{tItems}}</td>
        </tr>
      </table>
</div>

答案 1 :(得分:1)

在其td和tr元素上的forloop

<div style="border: outset; width:100px">
  <input type="text" #InputTxt style="width: 95px;">
  <br/>
  <table #Table style="border:solid black 2px;">
    <tr *ngFor="let row of columnNums">
      <td *ngFor="let col of row"  style="border:solid black 2px;"><input style="width: inherit;" type="button" (click)="Usednumber($event)" value="{{col}}"></td>
    </tr>
  </table>
</div>

在组件中:

columnNums = [[1, 2, 3], [4, 5, 6], [7, 8, 9], ['+', 0, '/'], ['=', '-', '*']];

&amp;在函数内部:

 let v = e.toElement.defaultValue;
    this.inputTxt.nativeElement.value += v;

    if (v != '=') {
      if (v == '*' || v == '+' || v == '/' || v == '-') {
        this.op = v;
        this.inputTxt.nativeElement.value = '';
      }
      else {
        if (this.op) {
          this.num2 = this.inputTxt.nativeElement.value;
        }
        else {
          this.num1 = this.inputTxt.nativeElement.value;
        }
      }
    }

    else if (v == "=") {
      this.op2=v;
      this.calculate();

这是我解决这个问题的最好方法