检查多个事件以在 Angular 中执行命令答案

【问题标题】：Check for multiple events to execute a command in Angular检查多个事件以在 Angular 中执行命令
【发布时间】：2018-08-19 15:50:39
【问题描述】：

当用户单击div 框时，我想更改 Angular 中布尔变量的值。为此，我认为我应该将变量与(mouseleave) 和(click) 绑定，即如果这两个事件都发生而不仅仅是值更改。这里的布尔变量是isOpen in .component.html 我的代码是这样的。

<div id="box1">

<!--div content-->

</div>

在divbox1，如果我们点击退出，我想关闭它。我该怎么做？
下面是它的 TypeScript 代码。

import {
    Component,
    OnInit
} from '@angular/core';

@Component({
    selector: 'service-box',
    templateUrl: './service-box.component.html',
    styleUrls: ['./service-box.component.scss']
})
export class ServiceBoxComponent implements OnInit {
    public isOpen = false;

    constructor() { }

    ngOnInit() {
    }
}

【问题讨论】：

只有html，javascript在哪里？
我已经为它添加了 TypeScript 代码。
How can I close a dropdown on click outside?的可能重复

标签： javascript angular typescript angular-material

【解决方案1】：

为您的 html 添加指令调用 ng-click 相当容易

<div id="box1" ng-click="yourFunction()"> </div>

在你的 js 中

$scope.yourFunction(){
mouseleave = true;
}

与指令 ng-mouseleave 相同 https://docs.angularjs.org/api/ng/directive/ngMouseleave https://docs.angularjs.org/api/ng/directive/ngClick

【讨论】：

感谢您的回答，但我正在使用 Angular 而不是 AngularJs。