import { Component, ElementRef, OnInit, ViewChild } from "@angular/core";
import { Router } from "@angular/router";
import { NzModalService } from "ng-zorro-antd";
import { NgForm } from "@angular/forms";
@Component({
selector: "list",
templateUrl: "./list.html",
styleUrls: ["./list.less"],
})
export class ListComponent implements OnInit {
public ngOnInit () { }
@ViewChild("canvas") private canvas: ElementRef;
@ViewChild("form") private form: NgForm;
public Info: InfoModel = new InfoModel();
public search () {
for (const i in this.form.controls) {
this.form.controls[i].markAsDirty();
}
if (this.form.valid) {
}
}
public accountList = [
{
accountInfo: {
logo: "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1526377215350&di=e0de464e570239930220e045edee7e29&imgtype=0&src=http%3A%2F%2Fimgsrc.baidu.com%2Fimgad%2Fpic%2Fitem%2Fb8389b504fc2d5620ea214c8ed1190ef76c66c69.jpg",
name: "",
type: "",
},
limit: "",
msgCount: 0,
createTime: 10000,
type: "",
},
{
accountInfo: {
logo: "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1526377215350&di=e0de464e570239930220e045edee7e29&imgtype=0&src=http%3A%2F%2Fimgsrc.baidu.com%2Fimgad%2Fpic%2Fitem%2Fb8389b504fc2d5620ea214c8ed1190ef76c66c69.jpg",
name: "",
type: "",
},
limit: "",
msgCount: 0,
createTime: 20000,
type: "",
},
{
accountInfo: {
logo: "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1526377215350&di=e0de464e570239930220e045edee7e29&imgtype=0&src=http%3A%2F%2Fimgsrc.baidu.com%2Fimgad%2Fpic%2Fitem%2Fb8389b504fc2d5620ea214c8ed1190ef76c66c69.jpg",
name: "",
type: "",
},
limit: "",
msgCount: 0,
createTime: 15000,
type: "",
},
];
public displayData = [...this.accountList];
}
class InfoModel {
public keyword: string;
}
<nz-table -sharpfilterTable [nzData]="displayData">
module.ts
import { CommonModule } from "@angular/common";
import { NgModule } from "@angular/core";
import { FormsModule, ReactiveFormsModule } from "@angular/forms";
import { BrowserModule } from "@angular/platform-browser";
import { NgZorroAntdModule } from "ng-zorro-antd";
import { OfficialAccounts } from "./officialAccounts.component";
import { ListComponent } from "./list/list";
import { RecycleBinComponent } from "./recycleBin/recycleBin";
import { AddAccountComponent } from "./addAccount/addAccount";
import { OfficialAccountsRouting } from "./officialAccounts.routing";
@NgModule({
imports: [
FormsModule, ReactiveFormsModule,
CommonModule,
OfficialAccountsRouting,
NgZorroAntdModule.forRoot(),
],
declarations: [
OfficialAccounts,
ListComponent,
RecycleBinComponent,
AddAccountComponent,
],
providers: [
],
})
export class OfficialAccountsModule { }