What is the difference between “ng-bootstrap” and “ngx-bootstrap”?

ng-bootstrap and ngx-bootstrap are two different projects by two different project teams that are trying to accomplish more or less the same thing – allowing you to use Bootstrap in Angular (2+) without the use of jQuery. They are both rebuilding the Bootstrap components using only Angular (no jQuery).The main differences are around which version … Read more

How to add bootstrap to an angular-cli project

IMPORTANT UPDATE: ng2-bootstrap is now replaced by ngx-bootstrap ngx-bootstrap supports both Angular 3 and 4. Update : 1.0.0-beta.11-webpack or above versions First of all check your angular-cli version with the following command in the terminal: ng -v If your angular-cli version is greater than 1.0.0-beta.11-webpack, then you should follow these steps: Install ngx-bootstrap and bootstrap: … Read more

How to implement Modal Dialog in Angular 2 and above

Your common child modal component will be as below import {Component,Input, ViewChild} from ‘@angular/core’; import { ModalDirective } from ‘ngx-bootstrap’; @Component({ selector: ‘common-modal’, template: ` <div bsModal #childModal=”bs-modal” class=”modal fade” tabindex=”-1″ role=”dialog” aria-labelledby=”mySmallModalLabel” aria-hidden=”true”> <div class=”modal-dialog modal-sm”> <div class=”modal-content”> <div class=”modal-header”> <h4 class=”modal-title pull-left”>{{title}}</h4> <button type=”button” class=”close pull-right” aria-label=”Close” (click)=”hideChildModal()”> <span aria-hidden=”true”>&times;</span> </button> </div> <div … Read more