首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >在angular 4中以编程方式过滤行

在angular 4中以编程方式过滤行
EN

Stack Overflow用户
提问于 2018-05-31 18:00:50
回答 1查看 32关注 0票数 0

我目前在我的angular 4应用程序中的一个表中显示数据,并应用了stying。我已经通过在配置文件中创建要突出显示的字段并循环这些行并突出显示来实现样式设置

表格

html代码

代码语言:javascript
复制
 <!-- Income table -->
            <div *ngIf="selectedFinancialOption===1 && fsIncomeStatementTable && fsIncomeStatementTable.length > 0" class="tab-pane fade active show" id="base-strategy--fs-statement" role="tabpanel" aria-labelledby="table-tab"
                aria-expanded="false">
                <table class="table">
                    <thead>
                        <tr style="height:50px">
                            <th *ngFor="let cell of fsIncomeStatementTable[0]"> {{cell}}</th>

                        </tr>
                    </thead>
                    <tbody>
                        <tr *ngFor="let row of fsIncomeStatementTable | slice:1" [ngClass]="{'net-cost': row[0] === incomeStatementStyles[0] || row[0] === incomeStatementStyles[1] || row[0] === incomeStatementStyles[2] || row[0] === incomeStatementStyles[3]}">
                            <td>{{row[0]}}</td>
                            <td *ngFor="let cell of row | slice:1">{{cell | shortAndBlankNumberFormat: 2}}</td>
                        </tr>
                    </tbody>
                </table>

            </div>
            <!-- Income table -->

配置代码

代码语言:javascript
复制
    export const CONSTS: any = {

results: {

    financialStatement: {
        //TO DO SORT THIS OUT - Used for Styling
        incomeStatementStyling: 'Net premiums written|AY Underwriting Gain|Net Investment income|Net Operating Income|Net Income',
        cashFlowStyling: 'Net Cash provided by operating activities|Cash and Investments, end of year',
        balanceSheetStyling: 'Total Cash and Investment|Total Assets|Total Liabilites|Total Liabilities Total Sh. Equity'
    }
}
}

角度组件

代码语言:javascript
复制
    const incomeStatementStyling: string[] = String(CONSTS.results.financialStatement.incomeStatementStyling).split('|');

    export class FinancialStatementComponent extends ReactiveComponent implements OnInit {
      isExpanded = false;

      incomeStatementStyles: string[] = incomeStatementStyling;

      constructor(private _projectionService: ProjectionService) {
    super();
  }

  @Input() set fsResult(value: FinancialStatementAnalysis) {
    this.processFSResults(value);
  }

   processFSResults(value: FinancialStatementAnalysis) {
    if (!value) {
      return;
    }
    this._fsIncomeStatementTable = this._projectionService.fsIncomeStatementResults(value.incomeStatement);

  }

      }

我现在需要过滤某些行。我该如何处理这部分呢?它是在配置中还是在组件级别上执行?

EN

回答 1

Stack Overflow用户

发布于 2018-05-31 18:12:06

要过滤Angular中的数据,只需执行以下操作:

代码语言:javascript
复制
this.filteredData = this.Data.filter((item) => item.Name.toUpperCase() === this.otherData.Name.toUpperCase());

有关该here.的更多信息

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/50621624

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档