Guest User

Untitled

a guest
Jan 11th, 2018
77
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.71 KB | None | 0 0
  1. <template #content let-c="close" let-d="dismiss">
  2. <div class="modal-body">
  3. <p>Modal body</p>
  4. </div>
  5. </template>
  6.  
  7. import { Component } from '@angular/core';
  8. import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
  9.  
  10. @Component({
  11. selector: 'my-hello-home-modal',
  12. templateUrl: './hellohome.modal.html'
  13. })
  14.  
  15. export class HelloHomeModalComponent {
  16. closeResult: string;
  17.  
  18. constructor(private modal: NgbModal) {}
  19.  
  20. open(content) {
  21. this.modal.open(content).result.then((result) => {
  22. this.closeResult = `Closed with: ${result}`;
  23. }, (reason) => {
  24. console.log(reason);
  25. });
  26. }
  27. }
  28.  
  29. import { Component, OnInit } from '@angular/core';
  30.  
  31. @Component({
  32. selector: 'my-home',
  33. templateUrl: './home.component.html'
  34. })
  35.  
  36. export class HomeComponent implements OnInit {
  37. constructor() {
  38. }
  39.  
  40. ngOnInit() {
  41. console.log('Hello Home');
  42.  
  43. /** want call modal popin here from the init component method in order to test the modal. **/
  44.  
  45. }
  46. }
  47.  
  48. @Component({
  49. selector: 'my-home',
  50. templateUrl: 'src/modal-basic.html'
  51. })
  52. export class HomeComponent implements OnInit {
  53. constructor(private modalService: NgbModal) {}
  54.  
  55. ngOnInit(content) {
  56. this.modalService.open('Hi tehre!');
  57. }
  58. }
  59.  
  60. import { Component, OnInit } from '@angular/core';
  61. import { HelloHomeModalComponent } from "hello-home-modal.component";
  62.  
  63. @Component({
  64. selector: 'my-home',
  65. templateUrl: './home.component.html'
  66. })
  67.  
  68. export class HomeComponent implements OnInit {
  69. constructor(private modal: HelloHomeModalComponent) {}
  70.  
  71. ngOnInit() {
  72. this.modal.open();
  73. }
  74. }
  75.  
  76. import { Component, OnInit } from '@angular/core';
  77. import {NgbActiveModal} from '@ng-bootstrap/ng-bootstrap';
  78.  
  79. @Component({
  80. selector: 'sm-create-asset-modal',
  81. templateUrl: './create-asset-modal.component.html',
  82. styleUrls: ['./create-asset-modal.component.css']
  83. })
  84. export class CreateAssetModalComponent implements OnInit {
  85.  
  86. constructor(public activeModal: NgbActiveModal) { }
  87.  
  88. ngOnInit() {
  89. }
  90. }
  91.  
  92. <div class="modal-header">
  93. <h4 class="modal-title">Create New </h4>
  94. <button type="button" class="close" aria-label="Close" (click)="activeModal.dismiss('Cross click')">
  95. <span aria-hidden="true">&times;</span>
  96. </button>
  97. </div>
  98. <div class="modal-body">
  99. <p>One fine body&hellip;</p>
  100. </div>
  101. <div class="modal-footer">
  102. <button type="button" class="btn btn-success" (click)="activeModal.close('Close click')">Create</button>
  103. </div>
  104.  
  105. export class MyComponent {
  106. constructor(private modal: NgbModal) {}
  107.  
  108. onClick() {
  109. this.modal.open(CreateAssetModalComponent);
  110. }
  111.  
  112. }
  113.  
  114. @NgModule({
  115. imports: [...],
  116. declarations: [CreateAssetModalComponent],
  117. entryComponents: [CreateAssetModalComponent]
  118. })
Add Comment
Please, Sign In to add comment