Question

<div class="container" (contextmenu)="onRightClick()">
</div>

我想禁用一些组件而不是整个网站的右键单击。我必须在要禁用右键单击的所有组件中定义以下功能。最好的方法是什么，这样我就不必在这些组件中一次又一次地定义函数

onRightClick() {
  return false;
}

Answer 1

这是contextmenu事件：创建一个指令来管理它。

Stackblitz

@HostListener('contextmenu', ['$event'])
onRightClick(event) {
  event.preventDefault();
}

Answer 2

我的建议是制定一条指令，使click绑定到附加元素。您可以获取有关其官方文档的小指南，它应该为您提供清晰的方法。

在这种情况下，您可以在整个应用程序中重用指令，并且将执行相同的操作。将click绑定到附加元素，并且其中包含一些逻辑，因此您无需重复自己的操作。

doc

示例：

import { Directive, HostListener } from '@angular/core';

@Directive({
  selector: '[appDisableRightClick]'
})
export class DisableRightClickDirective {
  @HostListener('contextmenu', ['$event'])
  onRightClick(event) {
    event.preventDefault();
  }
}

您还可以创建将导出此指令的模块，并在其他模块中使用它，只需导入该模块。模块应如下所示：

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { DisableRightClickDirective } from './disable-right-click.directive';

@NgModule({
  declarations: [
    DisableRightClickDirective
  ],
  imports: [
    CommonModule
  ],
  exports: [
    DisableRightClickDirective
  ]
})
export class DisableRightClickModule {
}

在每个要使用此指令的模块中，只需输入DisableRightClickModule。就是这样。

import { NgModule } from '@angular/core';
import { DisableRightClickModule } from './disable-right-click.module';

@NgModule({
  declarations: [
   ...
  ],
  imports: [
    ....,
    DisableRightClickModule
  ]
})
export class SomeDummyModule {
}

Answer 3

您可以轻松地执行以下操作： html中的************

env.setParallelism(2)
env.setStreamTimeCharacteristic(TimeCharacteristic.EventTime)
...
.keyBy(0) //("k",1576726230000)
.timeWindow(Time.seconds(2L))
...

***********在ts

<div class="container" (contextmenu)="onRightClick()">
</div>

注意：此代码仅对您引用的div禁用右键单击。如果要禁用所有页面，则可以使用：

onRightClick(event) {
    event.preventDefault();
  }

如何使从任何组件调用的角度禁用禁用右键单击功能

3 个答案: