Angular 6 - 如何在 IF 条件下更改组件在其模板中的值

标签 angular angular-controller

如果任何一个行数据满足某些特定条件(如第 5 行代码“myConditionCheck”),我将尝试显示或隐藏下面的“分隔符容器”。

我尝试通过将“isWarningSeperatorVisible”作为 Controller 类变量来实现它,并尝试在我的 HTML 代码中更改它。找不到在 IF 条件下更改它的方法。 有人可以帮助我如何根据 IF 条件或任何其他方式更改 Controller 变量来实现此用例吗?

<div class="separator-container" *ngIf="isWarningSeperatorVisible">
     My Separator heading
</div>

<ng-container *ngFor="let rowData of rowArray;">
   <div class="cards-row" *ngIf="rowData.myConditionCheck; let isWarningSeperatorVisible"> 
    <div>
        Some content goes here
     </div>
    </div>
</ng-container>

最佳答案

您可以执行以下操作:

在 .html 中:

<div class="separator-container" *ngIf="check()">

在 .ts 中:

check(){
    return this.rowArray.some((row)=>row.myConditionCheck)
}

这是一个 stackblitz .

关于Angular 6 - 如何在 IF 条件下更改组件在其模板中的值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52100116/

相关文章:

javascript - 在 AngularJS 上使用下拉菜单传递参数

javascript - 如果已经使用相同的请求运行,则取消订阅/取消 Angular 4 中的现有 HTTP/XHR 调用

angular - Angular 在文本输入中只允许数字

html - Angular HTML 字符串 - 重命名属性

javascript - Angular JS - module.controller 参数

javascript - 如何将 angularJS 应用程序转换为 angular

angular - 仅当可观察流为空时才显示 div

css - 将 primeng 评级组件的文本侧

javascript - 在任何 Controller 中存储来自 angular.run 的数据

javascript - Angularjs - Controller 多次调用 init() 函数