angular - 禁用整个角度分量

Question

我正在开发一个角度应用程序。应用程序由一个父组件组成，该组件包含多个子组件。每个子组件负责屏幕的一部分，如顶栏、侧栏、底栏等。

我有一个要求，我必须根据父组件中的某些状态将某些子组件变灰，以便用户无法对这些组件视图执行任何操作。

如何做到这一点？我知道 ng-disabled 用于禁用视图元素，但不能用于 div。那么有什么更好的选择呢？

标签： angular

Answer 1

您可以向父 div 添加一个条件类，例如

<div [ngClass]="{'disabled':yourCondition}">
<your-component></your-component>
</div>

然后在css中

.disabled
{
  pointer-events: none;
  /* for "disabled" effect */
  opacity: 0.5;
  background: #CCC;
}

演示