3

我有一个函数,它从 typescript 函数作为对象返回颜色、文本颜色和日期值。我想将其存储在 let 变量中。我可以直接使用该函数,但不想复制函数的调用。

这给了我错误,例如找不到“年份”

<kendo-grid-column-group title="{{year}}" [headerStyle]="{'text-align': 'center'}" width="380">
        <ul *ngFor="let month of keys(); let i = index">
          <li>
            <kendo-grid-column field="{{month}}" class="no-padding" title="{{month}}" [filterable]="false" [sortable]="false" width="35">
              <ng-template kendoGridCellTemplate let-dataItem let-color="getColor(year,i,dataItem.ca)">
                <span class="whole-cell" [ngStyle]="{'background-color': color.color,'color': color.textColor,'font-weight':'bold','height':'25px','vertical-align': 'middle'}">
                  <label>{{color.Date}}</label>
                </span>
              </ng-template>
            </kendo-grid-column>
          </li>
        </ul>
</kendo-grid-column-group>
4

2 回答 2

5

您需要传递 'content:this' 范围对象。

模板:

<ng-template let-color="getColor()" #loading>
                <span class="whole-cell" [ngStyle]="{'background-color': color.color,'color': color.textColor,'font-weight':'bold','height':'25px','vertical-align': 'middle'}">
                  <label>{{color.Date}}</label>
                </span>
              </ng-template>

<ng-container *ngTemplateOutlet="loading;context:this"></ng-container>

零件:

getColor() {
    return {
      color: 'red',
      textColor: 'blue',
      Date: 'hi'
    }
  }
于 2018-09-11T04:12:07.943 回答
0

一种可以使用的技术是滥用?*ngIf(检查支持它的角度版本)

<ng-container *ngIf="{color:getColor(year,i,dataItem.ca)}; let state">
     {{state.color.Date}}
</ng-container>
  • *ngIf 允许将表达式的结果存储在变量中。
  • 由于创建了一个对象,*ngIf 将始终是 thruthy,因此呈现 ng-container
  • ng-container 不呈现为 dom 元素,仅呈现其内容
于 2021-04-04T08:34:48.400 回答