Question

我在Angular组件的TypeScript部分中编写的函数对于应该可以调用它的HTML来说似乎是不可见的，但是可以调用同一文件中的其他函数。

已成功调用 loadPage（page + 1）函数，但未成功调用timedLoadResults（）函数。我也尝试了ng-keyup指令，但是没有产生函数调用结果（通过浏览器的网络流量验证，在执行时对服务器进行API调用）。

浏览器错误是：'timedLoadResults'未定义

HTML：

<input type="text" id="searchTextId" [(ngModel)]="searchText" name="searchText" placeholder="Search" onkeyup="timedLoadResults()" >
<div id="workflowsTable" class="table-responsive" *ngIf="onlineAcceptanceWorkflows">
    <table class="table table-striped">
//table headers...
        <tbody infinite-scroll (scrolled)="loadPage(page + 1)" [infiniteScrollDisabled]="page >= links['last']" [infiniteScrollDistance]="0">
            <tr *ngFor="let onlineAcceptanceWorkflow of (onlineAcceptanceWorkflows | customSearch: searchText) ;trackBy: trackId">

//...

TS：

loadPage(page) {
    this.page = (this.searchText != '')
                ? this.page
                : page;
    this.loadAll();
}

timedLoadResults() {
    if(this.searchText == ''){
        return;
    } else {
        if(this.timeOut != null) clearTimeout(this.timeOut);
        this.timeOut = setTimeout(() => this.loadPage(0), 150);
    }
}

Answer 1

之所以没有调用timedLoadResults是因为它没有绑定到keyup事件。要绑定到事件，请使用(keyup)="timedLoadResults()"而不是onkeyup。

Angular 5 HTML Comp。缺少TS Comp。的功能？

1 个答案: