Typescript 如何使用'；行。添加（…）和#x27；在jQuery数据表中？

我通过循环遍历data.courseApplications并为每个元素添加新行并添加每个列来解决这个问题，例如行.add（[{data.courseApplications[I].col1，…，data.courseApplications[I].colN}]）。但这还不够

我是jQuery DataTables的新手，我正在尝试在上重新初始化datatable 超链接上的单击事件。初始化datatable工作正常（使用敲除绑定、创建表等），但当我单击另一个事件时，datatable将不会重新初始化

我用两种不同的方法解决了这个问题，一种是清除现有的数据表并重新绘制它。第二种方法是销毁数据表并重新创建它

当我试图通过先清除数据表，然后将数组“data.courseApplications”（包含正确的数据）添加为行来“重新初始化”数据表时，出现以下错误

DataTables警告：表id=CourseMemount信息表-为第0行第0列请求了未知参数“0”。有关此错误的详细信息，请参阅

此错误发生在“viewOnClickEvent”-方法的此行上注意 数据表“显示”了正确数量的条目/行，但没有内容

    $("#coursemoment-info-table").DataTable().rows.add(data.courseApplications);

下面的代码显示了我的第一次尝试

Html:

<div class="row mb-0" data-bind="visible:!loadingCourseMoment()">
                <div class="col-md-12">
                    <div class="card-block pt-0">
                        <div class="table-responsive">
                            <table id="coursemoment-info-table"  class="table table-hover">
                                <thead>
                                    <tr >
                                      // headers
                                    </tr>
                                </thead>

                                <tbody>
                                    <!-- ko foreach: selectedCourseMoment().courseApplications -->
                                    <tr>

                                       // bindings

                                    </tr>
                                    <!-- /ko-->
                                </tbody>
                            </table>
                        </div>

---

我错过了什么

我认为问题是当您试图向datatable添加行时。请勾选此行“$（“#CourseMemount info table”）.DataTable（）.rows.add（data.courseApplications）”。在这里可能是data.courseApplications为nullHi，这没有帮助。我提出了一个解决方案，并将其添加到帖子中，但感觉还不够。不能让Knockout和DataTable同时管理DOM。你应该使用一个和操作数据，而不是操作DOM。我从来没有使用过Datatables，但是使用Knockout有什么错？是我为另一个问题做的小提琴

public viewCourseApplicationsClick = (selectedCourseMoment: ICourseMoment): void => {
    this.loadingCourseMoment(true);
    this.courseService.getCourseMomentByCourseNumber(selectedCourseMoment.courseNr)
        .then((data: any) => {
            this.selectedCourseMoment(data);
            if (this.tableInitiliazed) {
                $("#coursemoment-info-table").DataTable().clear().draw();
                $("#coursemoment-info-table").DataTable().rows.add(data.courseApplications); 
                $("#coursemoment-info-table").DataTable().columns().draw(); 
            } else {
                this.initCourseMomentInformationDataTable();
                this.tableInitiliazed = true;
            }

            this.loadingCourseMoment(false);

        }).catch((reason:any) => {
           console.log(reason);
        });
}