Zack Lucky
Zack Lucky

Reputation: 671

Angular 2 block ui component

What is the proper way to block the ui of a component in Angular 2?

Something like this

<component [blockUI]="true"></component>

Upvotes: 1

Views: 1132

Answers (1)

Meir
Meir

Reputation: 14395

In the component's less file put:

:host {
    pointer-events: none;
}

If you have components below, they will get the clicks, if you'd like to prevent this, instead of the css do:

<component (click)="$event.preventDefault()">

to make it dynamic, assuming you use less and have a variable called notInteractive:

:host {
  &.not-interactive {
    pointer-events: none;
  }
}

Upvotes: 2

Related Questions