Question

我如何通过id搜索项目，并以编程方式添加其他元素？

我搜索了网页，并在angularjs2的网站上搜索，但我找不到任何例子，如果错误是我做错了或者不这样做就行了。

@Component({
    selector: "testcomponente",
    template: `
    //other code  
    <div class = "container" id = "table1" >

    </div>
    `
 })


export class Mov {
.//
t(){
   var iDiv = document.createElement('div');
   iDiv.id = 'block';
   iDiv.className = 'block';
   var t : any = document.getElementsById('table1').appendChild(iDiv); <-- error
   .//
}

编译时出现此错误：

error TS2339: Property 'getElementsById' does not exist on type 'Document'.

感谢任何示例或链接，对不起我的英语。

Answer 1

根据HTML标准，页面上只允许一个选择器id。因此，您需要更正您的方法名称，应该是getElementsById单数而不是复数。

更改为

document.getElementById('table1')

而不是

document.getElementsById('table1')

但从技术上讲，如果你想根据需要动态添加元素的数量，你可以在这里使用ngFor指令来渲染它。

<强>代码

import { NgFor } from 'angular2/common'

@Component({
    selector: "testcomponente",
    template: `
    <button type="button" (click)="addElement()">Add Element</button>
    //other code  
    <div class = "container" id = "table1" >
       <div *ngFor="item in items"> Repeatative Item content </div>
    </div>
    `,
    directives: ['NgFor']
})

export class Mov {
    items: Array<number>();
    count: number = 1;

    addElement(){
       items.push(++number);
    }
}

AngularJS 2动态搜索div以获取id并添加新div

1 个答案: