Search code examples
javascriptangularjstypescriptangular7angular-components

How to remove plain text URL from data content column name offilneURL?

I face issue Cannot hide or remove URL exist as plain text on column name offilneUrl

I already do as link so that no need to plain text URL above

So I need to hide or remove or empty URL plain text above word page link .

 <tbody>
                  <ng-container *ngFor="let repcon of ReportControl">

                    <tr *ngFor="let rep of contentBody">

                      <td *ngFor="let coln of headerCols">


                        <span> 

                          {{rep[coln]}}
                        </span>
                        <div *ngIf="coln==repcon.fieldName">


                          <div *ngIf="repcon.columnType==1">

                            <a (click)="goToLink(rep.offilneURL)">page link</a>
                         </div>
                        </div>

                        </td>
                    </tr>
                </ng-container>

                </tbody>

I try as below {{rep.offilneURL || " "}} but it repeated offlineURL with every row

so what i do to solve issue

see image below the text with green color that i need to remove because it .

post updated

structure of content body on ts file

this._displayreport.GetReportDetailsPaging(this.searchData).subscribe((data: any[]) => {

        this.reportdetailslist = data;
       this.headerCols = Object.keys(data[0]);
      this.contentBody = data;

      });

data structure for content body :

companyName: "Innovasic, Inc."
done: "0"
notImpacted: "0"
notificationDate: "2009-11-12"
offilneURL: "https://source.z2data.com/2019/1/13/8/55/47/351/662203977/21527_SPCN.PDF"
onlineURL: "N/A"
pending: "3"
reportDate: "2020-05-07"
revisionID: "272299243"
teamName: "MFG"
totalCount: 79

already have link

plain text surrounded with green color

Updated post 

https://stackblitz.com/edit/create-4ud1rg?file=app%2Fapp.component.html

according to my structure I need to change 

<span *ngIf="coln != 'onlineURL'"> 
  {{rep[coln]}}
</span>

to 

<span *ngIf="coln != 'repcon.filedName'"> 
      {{rep[coln]}}
    </span>
Solution

  • It's just because:

    <span>
  {{rep[coln]}}
</span>

    is still displaying the value regardless so just hide it if the column is the url

    <span *ngIf="repcon.columnType != 1">
  {{rep[coln]}}
</span>