@lukana/modals
TypeScript icon, indicating that this package has built-in type declarations

2.0.2 • Public • Published

Lukana modals

Modals using only @angular/cdk as dependencies.

Usage

  1. Add @lukana/modals/scss/modal to Your style.scss file or use Your own styles.

  2. Import ModalsModule as dependency.

  3. Add modals content component to entryComponents

  4. Inject ModalService as dependency in You component, and open modal with command ModalService.open(YourComponent):

    @Component({
      selector: 'app-page',
      templateUrl: './app-page.component.html'
    })
    export class AppPageComponent implements OnInit {
    
      constructor(private modalService: ModalService) {
      }
    
      ngOnInit() {
      }
    
      onOpenModal() {
        const dataPassedDoComponent = {name: 'Hello'};
        this.modalService.open(ModalContentComponent, dataPassedDoComponent)
          .subscribe(resp => console.log('returned', resp));
      }
    }
  5. In modal component You can Inject ModalService and close modal with return value like this:

    @Component({
      selector: 'lukana-modal-content',
      templateUrl: './modal-content.component.html',
      styleUrls: ['./modal-content.component.css']
    })
    export class ModalContentComponent implements OnInit {
      name: string;
      constructor(private modalService: ModalService) {
      }
    
      ngOnInit() {
      }
    
      onClose() {
        this.modalService.close('returnValue');
      }
    }

/@lukana/modals/

    Package Sidebar

    Install

    npm i @lukana/modals

    Weekly Downloads

    14

    Version

    2.0.2

    License

    none

    Unpacked Size

    96.2 kB

    Total Files

    29

    Last publish

    Collaborators

    • piernik