# goten-ngmodal-delete

> When deleting something, we usually want to show some confirmation to make sure the user actually wants to delete and didn't misclick. Because this is common behaviour, and shouldn't change drastically from different use cases, we've created the **goten-n

Latest version **1.0.1** (published 2019-02-26) · ISC license · 0 weekly downloads

## Install

```sh
npm install goten-ngmodal-delete
pnpm add goten-ngmodal-delete
yarn add goten-ngmodal-delete
bun add goten-ngmodal-delete
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.1 |
| Published | 2019-02-26 |
| First published | 2019-02-25 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 77.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | joncolque |
| Keywords | cys, goten, angular |

## Links

- npm: https://www.npmjs.com/package/goten-ngmodal-delete
- npm.io page: https://npm.io/package/goten-ngmodal-delete

## Dependencies (1)

- [tslib](https://npm.io/package/tslib.md) ^1.9.0

## Recent versions

- 1.0.1 (latest) — 2019-02-26
- 1.0.0 — 2019-02-26
- 0.0.2 — 2019-02-25
- 0.0.1 — 2019-02-25

## README

# Generic Modal for deleting items
When deleting something, we usually want to show some confirmation to make sure the user actually wants to delete and didn't misclick. Because this is common behaviour, and shouldn't change drastically from different use cases, we've created the **goten-ngmodal-delete** package.


## Requirements
You must have ng-bootstrap installed

## Usage

``` bash
$ npm install -s goten-ngmodal-delete
```

``` ts
//app.module.ts
...
import { GotenModalDeleteComponent } from 'goten-ngmodal-delete'
@NgModule({
	...
	declarations: [
		...,
		GotenModalDeleteComponent
    ],
    entryComponents:[
        ...,
        GotenModalDeleteComponent
    ]
})
```
``` ts
//context.component.ts
...
import { Component } from '@angular/core';
import { YourService } from './your.service'
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
import { GotenModalDeleteComponent } from 'goten-ngmodal-delete'

@Component({
    ...
})
export class ContextComponent {
  constructor(
    public yourService : YourService,
    private modalService: NgbModal,
  ){}

  delete(id){
    const modalRef = this.modalService.open(GotenModalDeleteComponent, {size:"sm"})
    const modalEdit: GotenModalDeleteComponent = modalRef.componentInstance;
    modalEdit.service = this.yourService
    modalEdit.dataToDelete = id
    modalEdit.onConfirm = (msg) => {
      console.log("press Delete", msg)
    }
    modalEdit.onCancel = () => {
      console.log("press Cancel")
    }
    modalRef.result.then(() => {}, () => {});
  }
}

```

## goten-ngmodal-delete's parameters

|Prop name | Type   | Description   |
|---|---|---|
| service (required) | Any Angular service | The service to use for deleting the element
| dataToDelete (required) | String | Parameter to identify the element we want to delete
| nameMethodDelete | String | The service's delete method name. By default, it uses the name 'delete'
| onConfirm | Function | Callback when pressing 'Confirm'. The service sends a response by parameter (see example above)
| onCancel | Function | Callback when pressing 'Cancel'
| textShow | Object | **title** ("Delete" by default), **message** ("`The element will be deleted`" by default), **cancel** ("Cancel" button by default), **confirm** ("Confirm" button by default) that show on Modal.
## Contributions

To contribute with this package, we use the following workflow:
- Add an issue with related tags to describe the contribution (is it a bug? a feature request?).
- Branch your solution from develop, naming it like #<issue_number>-<descriptive_name>.
- Send a pull request and wait for approval/corrections.

---
_Source: https://npm.io/package/goten-ngmodal-delete · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._