时间戳

首页 > 解决方案 > 如何在 batton 中获取 gridview 绑定数据单击角度和类型脚本中的 gridview 外部

angular - 如何在 batton 中获取 gridview 绑定数据单击角度和类型脚本中的 gridview 外部

问题描述

我btnBack在 gridview 外有按钮，每当启用这些按钮并且有人点击时，我想获取 gridview 绑定数据或至少触发loadWorkflow(att,false)，以便我将数据绑定到 gridview。完整代码如下

有角度的

                        <tr><input matInput type="text" id="txtHardware" name="txtHardware"
                            [(ngModel)]="txtAttachment" [hidden]="!showHardware"></tr>
 <tr  id="divnavigation" [hidden]="!Showdiv"  >
                                <td>
                                    <button id="btnBack" (click)="Navigate()" style='cursor: pointer; cursor: hand;background-color: #008CBA;border-radius: 8px;'><i class='fa fa-arrow-left' aria-hidden='true'></i>BACK</button> 
                                </td>
                                
                            </tr>
                            <div class="col-md-12">
                                <div class="row" [hidden]="!showGrid">
                                        <h4 class="text-info"> Attachments</h4>
                                        <div class="content table-responsive">
                                            <table class="table table-bordered table-responsive-md table-striped text-left">
                                                <thead>
                                                    <tr>
                                                        <th></th>
                                                    </tr>
                                                </thead>
                                                <tbody>
                                                    <!--*ngIf="Model?.length > 0"-->

                                                    
                                                        <tr *ngFor="let att of asyncModelAttachmnts | async  | paginate: { id: 'activities', itemsPerPage: 5, currentPage: p }" >
                                                            <td (click)="loadWorkflow(att,false)" style='width:20px;height:20px;cursor: pointer;'>
                                                              <!--  <button (click)="loadWorkflow(att)"> {{att.NAME}}</button>-->
                                                              {{att.NAME}} 
                                                            </td>
                                                            
                                                        </tr>
                                                    
                                                    <tr *ngIf=" !(this.total > 0)  ">
                                                        <td colspan="14" style="text-align:center">
                                                            No Records Found.
                                                        </td>
                                                    </tr>
                                                </tbody>
                                            </table>
                    
                                           
                                        </div>
                    
                                </div>
                    
                            </div>

键入脚本

loadWorkflow(att, flg) {
    this.EnableBackButton(att);
   
        this.backward=false;
            this.filter = new liveLinkFilter({
                doc_id: att.ID, psite_slno: att.psite_slno, FileId: att.ID, LLUserName: "akolleri",
                TYPE: att.TYPE, INDEX: att.INDEX, backward: this.backward, firsttime: false, ids: att.Ids, FileName: ""
            });
            this.txtAttachment=att.ID;
       
        this.asyncModelAttachmnts = this.appService.Getfiles(this.filter).pipe(
            tap(res => {
                this.page = 1;
                this.total = res.TotalNumberOfRecords;
                for (let item of res.Results) {
                  //  this.txtAttachment=item.back_id;
                    console.log("ids = "+item.Ids);
                    if (item.Ids.includes('second')) {
                        this.Showdiv = true;
                        this.back_fileid=item.Ids;
                    }
                        else
                            this.Showdiv = false;
                    
                } 


                if (this.total > 10) {
                    this.showPagination = true;
                } else {
                    this.showPagination = false;
                }

            }),
            map(res => res.Results)
        );

    }
  Navigate()
    {
        this.backids=this.txtAttachment;
        console.log("back id is ="+this.backids.split(',').length);
        this.backids=  this.backids.split(',')[this.backids.split(',').length-2];
        console.log("back id is ="+this.backids);
        this.filter = new liveLinkFilter({
            doc_id: this.backids, psite_slno: 0, FileId: this.backids, LLUserName: "akolleri",
            TYPE: "", INDEX: 0, backward: false, firsttime: false, ids: "", FileName: ""
        });
        this.asyncModelAttachmnts = this.appService.Getfiles(this.filter).pipe(
            tap(res => {
                this.page = 1;
                this.total = res.TotalNumberOfRecords;
                for (let item of res.Results) {
                   // this.txtAttachment=item.back_id;
               
                } 
   
                this.showGrid = true;

            }),
            map(res => res.Results)
        );
    }
    EnableBackButton(att)
    {
        this.Showdiv = true;this.backward=true;        
    }

标签： angulartypescriptngfor

解决方案

我没有浏览你的完整代码，如果我错了，请纠正我。

因此，在单击 时btnBack，您想显示特定部分并调用一个函数。尝试这样做：

<div #yourGridView *ngIf="showGridView">
</div>

<button id="btnBack" (click)="someFunction()"></button>

你的 ts 将是：

showGridView = false;
someFunction() {
  //do your job
  this.showGridView = true;
}

推荐阅读