Is there a way to remove an event listener once the associated button has been clicked within the given code?

Is there a way to prevent this event from triggering once the "dispensed" button is clicked in another module? Here is the code snippet:

 stopDrugOrder(e: Event, drugOrder: any, drugName: string) {
    const confirmDialog = this.dialog.open(SharedConfirmationComponent, {
      width: "25%",
      data: {
        modalTitle: `Stop Medicaton`,
        modalMessage: `You are about to stop ${drugName} for this patient, Click confirm to finish!`,
        showRemarksInput: true,
      },
      disableClose: false,
      panelClass: "custom-dialog-container",
    });

    confirmDialog.afterClosed().subscribe((confirmationObject) => {
      if (confirmationObject?.confirmed) {
        this.encounterService
          .voidEncounterWithReason({
            ...drugOrder?.encounter,
            voidReason: confirmationObject?.remarks || "",
          })
          .subscribe((response) => {
            if (!response?.error) {
              this.loadVisit.emit(this.visit);
            }
            if (response?.error) {
              this.errors = [...this.errors, response?.error];
            }
          });
      }

I'm stuck on this issue, any suggestions would be greatly appreciated

angulartypescript

Answer №1

Definition:

e.target denotes the specific element that initiated the event.

e.currentTarget, on the other hand, points to the element to which the event listener is bound.

One can execute the following code snippet:

stopDrugOrder(e: Event, drugOrder: any, drugName: string) {
    if(e.currentTarget needs to be halted){
      e.stopPropagation()
      return
    }
    //--- main function logic here ---
}

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Unable to access structuredClone on the global object within a Node.js application

structuredClone is causing issues in my NodeJS application. Whenever I try to utilize it, I encounter the error: structuredClone is not defined nodejs. To troubleshoot, I created a simple file and executed the following: console.log({ globals: Object. ...

node.jstypescriptglobalstructured-clone

How to Establish an Angular Global Variable

What is the process for establishing a global variable in Angular? I have established a variable within a service, entered a value in the login component, and attempted to access this variable from another component. However, I noticed that the value res ...

angulartypescript

What is the specific category of Mongoose.startSession in the realm of Typescript?

In my Express/Typescript project with mongoose, I implemented a loader as follows: import mongoose from 'mongoose'; import { Db } from 'mongodb'; import config from '../config'; export default async (): Pr ...

node.jstypescriptexpressmongoosetransactions

When a webpage is moved, the globalProperties variable of "vue3 typescript" is initialized to null

main.ts const app = createApp(App) .use(router) .use(createPinia()) .use(vuetify) .use(vue3GoogleLogin, googleLogin) const globalProps = app.config.globalProperties; globalProps.isDebugMode = true; vue-shim declare ...

javascripttypescriptvue.jsvuejs3

Spying on ActivatedRoute.queryParams is not possible in Angular when using Jasmine

Is there a way to effectively spy on a stubbed Angular Service method that should return an Observable like ActivatedRoute.queryParams? The below code snippet shows my failing test case: import { TestBed, ComponentFixture } from "@angular/core/testing"; i ...

angulartestingjasmine

Showing a notification in Angular 4 following a background request

In my page, I have a list of posts that display comments when clicked. Everything is working well, but now I want to show a message if there are no comments for the selected post. Here's how I tried setting up the template: <li *ngFor="let post of ...

angular

When setting a value through the DOM, the input's value bound with ngModel in Angular does not get updated

Trying to upload a file to calculate its hash and display it in an input box. If done correctly, the value should show in the form, but when submitting the form, the value does not get sent. Only adding a blank space by clicking on the input field works: ...

javascriptangularangular-ngmodel

CSS: Placing items within an ng-for loop utilizing the "fixed" position property

<ul class="nav nav-pills nav-stacked" style="list-style: none"> <li *ngFor="#el of dragZoneElems; #idx = index"> <h4 style="position: fixed; top:'idx'*10" [dragResponder]="el">{{el.first}} {{el.last}}</h4& ...

cssangularjsangular

Why are my values not being applied to the model class in Angular 7?

I'm currently developing an online shopping website where I have defined my order Model class as shown below: import { User } from './user.model'; export class Order { constructor(){} amount: Number = 0; status: String = ""; date: ...

javascriptangulartypescript

Extending the Object prototype within an ES6 module can lead to errors such as "Property not found on type 'Object'."

There are two modules in my project - mod1.ts and mod2.ts. //mod1.ts import {Test} from "./mod2"; //LINE X interface Object { GetFooAsString(): string; } Object.prototype.GetFooAsString = function () { return this.GetFoo().toString(); } //mod2. ...

typescriptprototype

The Exporting menu in AmCharts4 does not include the ability to export in CSV, XLSX, or JSON formats

Right now, I am working with AmCharts4 and my objective is to export chart data in various formats such as CSV, XLSX, and JSON. To implement this, I have included the following scripts in index.html: <script src="https://www.amcharts.com/lib/4/core.js" ...

angularamchartsamcharts4

Assign a class to a button created dynamically using Angular

While working on my project, I encountered an issue where the CSS style was not being applied to a button that I created and assigned a class to in the component.ts file. Specifically, the font color of the button was not changing as expected. Here is the ...

cssangulartypescriptcomponentssetattribute

The success method in the observable is failing to trigger

Could someone explain why the () success method is not triggering? It seems to be working fine when using forkjoin(). Shouldn't the success method fire every time, similar to a final method in a try-catch block? Note: Inline comments should also be c ...

javascriptangularobservable

Trouble arises when attempting to transfer cookies between server in Fastify and application in Svelte Kit

In the process of developing a web application, I am utilizing Fastify for the backend server and Svelte Kit for the frontend. My current challenge lies in sending cookies from the server to the client effectively. Despite configuring Fastify with the @fas ...

javascripttypescriptcookiessveltefastify

How to Guarantee NSwag & Extension Code is Positioned at the Beginning of the File

In my project, I am using an ASP.Net Core 3.1 backend and a Typescript 3.8 front end. I have been trying to configure NSwag to include authorization headers by following the guidelines provided in this documentation: https://github.com/RicoSuter/NSwag/wik ...

c#typescriptnswag

Exploring ways to conduct a thorough scan of object values, inclusive of nested arrays

My goal is to extract all values from an object. This object also includes arrays, and those arrays contain objects that in turn can have arrays. function iterate(obj) { Object.keys(obj).forEach(key => { console.log(`key: ${key}, value: ${o ...

typescriptiteration

What is the process for type checking a Date in TypeScript?

The control flow based type analysis in TypeScript 3.4.5 does not seem to be satisfied by instanceof Date === true. Even after confirming that the value is a Date, TypeScript complains that the returned value is not a Date. async function testFunction(): ...

typescriptfirefox-addon-webextensionstypescript3.0

How can I retrieve List<T> from a Razor Page using TypeScript?

Within my ViewModel, I have an Items collection: public class ItemViewModel{ public List<Item> Items {get;set;} } In the Index.cshtml file: @if(Model.Items != null){ <li><a id="item-id-link" href="#" data-items="@Model.Items"> ...

asp.net-mvctypescriptrazor

How can variables from state be imported into a TypeScript file?

Utilizing vue.js along with vuetify, I have a boolean value stored in state via Vuex defined in src/store/index.ts (named darkMode). This value is used within one of my view components inside a .vue file. However, I now wish to access the same variable in ...

typescriptvue.jsstatevuexstore

Is it possible for an object to receive notifications when a component object undergoes changes in Angular 2/4?

When working with Angular components, it's possible to pass a variable or object as @Input(). The component will be notified whenever the value of this input changes, which is pretty cool... I'm currently developing an application that features ...

javascriptangulardata-bindingangular2-databinding