时间戳

首页 > 解决方案 > 动态账单生成

javascript - 动态账单生成

问题描述

我已经生成了一个账单，账单中有很多项目，我必须隐藏收费 amt = 0 的项目，它应该在账单上打印收费项目amt > 0

这是我的 html 文件

这是我的视图账单页面

  1. 项目清单

    <ion-title align="left">Bill</ion-title>   </ion-navbar>

    英语 德语 西班牙语 法语 马拉地语

    -->

    चारकोप (1)enter code here {{item.Society_Name}}</b> -->

    -->

    <div class="row" style=" border-bottom: solid black;
border-width: 1px;">

  <div class="col">पावती क्रमांक :
    <b>{{this.name.bill_no}}</b>
  </div>
</div>
<div  style="display: grid;
grid-template-columns: auto auto;">
    <div  style="  border: 1px solid rgba(0, 0, 0, 0.8);
    float:left;
    text-align: center;">Name :
    <b>{{this.name.bill_name}} </b></div>
    <div  style=" border: 1px solid rgba(0, 0, 0, 0.8);
    float:right;
    text-align: center;">Bill Date :
    <b>{{this.name.bill_period}}</b></div>

    <div  style="  border: 1px solid rgba(0, 0, 0, 0.8);
    float:left;
    text-align: center;">
        Bill For : <b>{{this.name.bill_period}}</b>
    </div>
    <div  style=" border: 1px solid rgba(0, 0, 0, 0.8);
    float:right;
    text-align: center;">
    Due Date : <b>{{this.name.bill_due}}</b>
    </div>

    <div  style="  border: 1px solid rgba(0, 0, 0, 0.8);
    float:left;
    text-align: center;">
       Wing :
       <b>{{this.name.wing}}</b>
    </div>
    <div  style=" border: 1px solid rgba(0, 0, 0, 0.8);
    float:right;
    text-align: center;">
       Floor No :  <b>2</b>
    </div>
</div>
<div  style="display: grid;
grid-template-columns: auto auto auto;">
      <div class="col" style="background-color: rgb(255, 173, 22);
      color: white;  float: left; " >
        <b>Sr.</b>
      </div>
      <div class="col" style="background-color: rgb(255, 173, 22);
      color: white;  float: left;  " >
        <b>शुल्क विशेष&lt;/b>
      </div>
      <div class="col" style="background-color: rgb(255, 173, 22);
      color: white;  float: left; ">
        <b>रक्कम&lt;/b>
      </div>
</div>
<div  style="display: grid;
grid-template-columns: auto auto auto;">

      <div class="col" style="background-color: rgb(228, 227, 227);" >
        <div class="row" style="background-color: rgb(228, 227, 227);" *ngFor="let item of particulars; let i = index">{{i + 1}}</div>
      </div>
      <div class="col"  size="8" style="background-color: rgb(228, 227, 227); " >

      <div class="row"   style="background-color: rgb(228, 227, 227);" *ngFor="let item of particulars">{{item.title}}</div>
      <!-- <ion-item *ngIf="this.products === charg_amt && charg_amt === 0"></ion-item> -->
      </div>
      <div class="col"  style="background-color: rgb(228, 227, 227); "  >
        <div class="row"   style="background-color: rgb(228, 227, 227);" *ngFor="let item of particulars">{{item.charg_amt}}</div>
        <!-- <ion-item *ngIf="!this.item.charg_amt.deleted === false">{{name.charg_amt}} </ion-item> -->
        <!-- <div *ngIf="this.products === charg_amt">  -->

      </div>

</div>
<!-- <div class="row" style=" border-bottom: solid black;
border-width: 1px;">
  <div class="col particularsList" style="background-color: rgb(228, 227, 227);" col-2>
    <div class="row particularsList" style="background-color: rgb(228, 227, 227);" *ngFor="let item of particulars; let i = index">{{i + 1}}</div>
  </div>
  <div class="col particularsList"  style="background-color: rgb(228, 227, 227);"  col-50>
    <div class="row particularsList"   style="background-color: rgb(228, 227, 227);" *ngFor="let item of particulars">{{item.charge_title}}</div>
  </div>
  <div class="col particularsList"  style="background-color: rgb(228, 227, 227);"  col-3>
    <div class="row particularsList"   style="background-color: rgb(228, 227, 227);" *ngFor="let item of particulars">{{item. charge_amt}}</div>
  </div>
</div> -->

<div  style="display: grid;
grid-template-columns: auto auto auto auto;
grid-gap: 1px; border-bottom: solid black;
border-width: 1px;">
  <div class="col" style="grid-column: 1 / span 2;">मागील तारख :- २१७०८&lt;/div>
  <div class="col" >
    <div class="row" style="grid-column: 2 ;">
      <div class="col">उप एकूण ₹&lt;/div>

      <div class="col">{{this.name.sub_Total}}</div>
    </div>
    <div class="row" style=" border-bottom: solid black;
    border-width: 1px;">
      <div class="col particularsList"  style="background-color: rgb(228, 227, 227);" >
        <b>एकूण देय रक्कम ₹&lt;/b>
      </div>
      <div class="col particularsList"  style="background-color: rgb(228, 227, 227);" >
        <b>{{this.name.grand_total}}</b>
      </div>
    </div>
  </div>
</div>

<div class="row" style=" border-bottom: solid black;
border-width: 1px;">
  <div class="col">
    <B>नियम:</B> 
      <P>1. प्रत्येक महिन्याच्या २० तारखेपर्यंत देखभाल खर्चाचा कर
      प्रदान करावा . कर प्रदान न केल्यास २१% दराने बाकी रक्कमेवर व्याज आकारला जाईल. </P>
    <P>2. प्रत्येक महिन्याच्या २० तारखेच्या आत देयकाची रक्कम प्रधान करावी.</P>
    <P>3. धनादेशाने रक्कम भरायची असल्यास धनादेश चारकोप  (१) 
      लि या नावाने.२० तारीखेयपूर्वी घ्यावा.</P> 
      <!-- <p *ngFor="let item of RuleData; let i = index">{{i+1}}.{{item.rule | translate }} </p>  -->

  </div>
</div>

<div class="row" style=" border-bottom: solid black;
border-width: 1px;">
  <div class="col particularsList"   style="background-color: rgb(228, 227, 227);" align="right">
    `enter code here` (1) 
  </div>
</div>

<div class="row authSign"  style=" height: 100px;" >
  <div class="col" align="right">
    <b>अधिकृत सही</b>
  </div>
</div>

    {{item.title}} ({{item.charg_amt}}) Bearbeiten Löschen Print

标签： javascriptangulartypescriptionic-framework

解决方案

尝试这个

  <ion-item-sliding *ngIf="!item.deleted && item.charg_amt" #products>

我所做的更改在您的 ngIf 中添加了一个条件&& item.charg_amt

推荐阅读