Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • How to use modal popup in Angular UI Bootstrap

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 1.94k
    Comment on it

    Angular UI Bootstrap provides $uibModal service to create modal windows. Before using this you need to create a template, controller and reference them with $uibModal service.

    It has only one method i.e. open(options).

    $uibModal's open function options parameter includes:

    • animation: It is boolean type and default value is true.
    • appendTo: It is angular.element type and default value is body. You can append modal to any element.
    • backdrop: It is boolean type and by default true. You can control the presence of overlay behind popup with it.
    • backdropClass: Add classes to modal backdrop.
    • windowClass: Add classes to modal window template.
    • template: Inline template to represent the content of modal.
    • templateUrl: Path to some template to represent the content of modal.

    The open method returns an instance of modal. It is an object with the these properties:

    close(result): It is function type and used to close a modal with result.

    dismiss(reason): It is used to dismiss a modal and of type function.

    result: It is of type promise and resolved when a modal is closed and rejected when a modal is dismissed.

    The scope is associated with the content of modal has:

    $close: It is a function that is used to close a modal.
    $dismiss: used to dismiss a modal.

    You can see the demo here: http://plnkr.co/edit/rPt10oTutaUD5Jj8GYyX?p=preview

     

     

 0 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: