小编red*_*ian的帖子

我有一个ngx-pagination的自定义分页模板实现,它正常工作.但是,当我尝试使用带分页的过滤器管道时,分页会中断:分页控件保持与应用过滤器之前相同,并且过滤后的数据集不再分页(11个项目出现在屏幕上而不是10个) .页面底部的分页控件在过滤时仍然可见,但不会影响过滤后的数据,即不会更改页面.

组件HTML

<task-manager-record *ngFor="let record of filteredDraftRecords | draftFilter: draftFilterArg | paginate: getPaginationOptions(tabIndex); let i = index;" [record]="record"></oir-task-manager-record>
<div class="totalRecords">
    <label>Total </label>
    {{ (filteredDraftRecords | draftFilter:draftFilterArg)?.length }}
</div>
<pagination *ngIf="(filteredDraftRecords | draftFilter:draftFilterArg)?.length > getPaginationOptions(tabIndex).itemsPerPage"
          (pageChange)="onChangePage($event)"
          [options]="getPaginationOptions(tabIndex)">
</pagination>

组件ts

import { Component, OnInit } from '@angular/core';
import { RecordViewModel } from '../models/app.models';
import { MotionStatus } from '../models/enum.model';
import { PaginationOptions } from 'proceduralsystem-clientcomponents';
import { SelectItem } from '@motions/motions.model';
import { TaskManagerService } from './task-manager.service';

@Component({
  selector: 'task-manager',
  templateUrl: …

我试图根据用户是选择电话还是电子邮件单选按钮来隐藏或显示联系人表单的电子邮件/电话号码部分，但是我无法弄清楚为什么它对我不起作用。我已经搜索了堆栈溢出和w3Schools，并且可以确定我使用的是正确的语法，但根据单选按钮，它仍然不会显示/隐藏。任何帮助将不胜感激！

的HTML

<form name="contactForm" id="contactForm" method="post" action="result.php">
                <fieldset>
                    <!-- Client's contact details -->
                    <legend>Contact Details</legend>
                        <label for="fullname">Full Name:</label>
                        <input type="text" name="contact" id="fullname" required>

                        <label>Preferred contact method:</label>
                        <input type="radio" name="contact" value="rdoPhone" id="rdoPhone" checked="checked" onclick="cPhone()" >Phone
                        <input type="radio" name="contact" value="rdoEmail" id="rdoEmail" onclick="cEmail()" >Email

                        <label for="phonenumber">Phone Number:</label>
                        <input type="text" name="contact" id="phonenumber">
                        <label for="email">Email:</label>
                        <input type="text" name="contact" id="email">
                </fieldset>
</form>

的CSS

#email {
display:none;
}       
#phonenumber {
    display:none;
}

Java脚本

function cPhone() {
if (document.getElementById("rdoPhone").checked)
{ document.getElementById("phonenumber").style.display = "block"; }
}

function cEmail(){
if …