ngx-bootstrap

I'm making project in bootstrap (UI) and angular 2. I'm new to both things My friend suggests me to use ng2 bootstrap I am so much confused between ngx bootstrap and ng2 bootstrap. Always when I search ng 2 bootstrap it take me to the ngx bootstrap. What is the difference between the two? ng2-bootstrap and ngx-bootstrap are one and the same: ng2-bootstrap was the old name, ngx-bootstrap is the new name. It's a project that's attempting to create an Angular-specific version of the Twitter Bootstrap components (i.e. no dependency on jQuery). The project is run by Valor Software. I don't have

I'm trying to use ngx-bootstrap-modal to pass data from a modal service into a modal component. The examples show this: this.modalService.show(ModalContentComponent, {initialState}); But it doesn't show how the ModalContentComponent actually consumes that state. I've played around in a debugger and I never see my component getting that data. How do I access it from the component? You can also use the BsModalRef content Like my-modal.component.ts export class MyModalComponent { public myContent; constructor(){} } calling your modal from some other component import { BsModalService, BsModalRef }

What I'm trying to do is open a modal from another component, however I keep getting this error TypeError: Cannot create property 'validator' on string 'test1' when component1.html loads because childModal is included. How can I get rid of these errors and implement this properly? component1.html <button type="button" class="btn btn-outline-primary btn-lg" (click)="modal.showModal()">Test ...... <child-modal #childModal ></child-modal> component1.ts @ViewChild('childModal') childModal: ModalComponent; modal.html <div bsModal #childModal="bs-modal" class="modal fade" tabindex="-1" role="dialog>

模态框是项目中经常会用到的一个公共功能，通常会被用左提示框或者扩展选项框。 下面，我用一个小例子来简单展示实现模态框功能的过程： 1、为项目加包： ng add ngx-bootstrap 2、在xxx.module.ts(模块.ts文件)中引入： ... import { ModalModule } from "ngx-bootstrap/modal"; ... @NgModule({ imports: [ ... ModalModule.forRoot(), ... ] }) ... 3、创建一个模块框公共组件： //.ts部分 import { Component } from '@angular/core'; import { BsModalRef } from 'ngx-bootstrap'; @Component({ selector: 'response-modal', templateUrl: './response-modal.html' }) export class ResponseModalService { public header: string; public body: string; constructor(public modalRef: BsModalRef ) {} } <!-- 模态框模板部分 .html --> <style>

I have changed some files present in node_modules folder. But when I build the application using ng build -op="app" --base -href="dist" --aot and when I deploy it to server I see the changes that I made in node_modules were not there. How to overcome this? I have tried in the below 3 ways I have forked the ngx-bootstrap repository into GIT Then I have used npm install https://github.com/krishnag9/ngx-bootstrap/tarball/master in my project. I have changed import { BsDaterangepickerDirective } from 'ngx-bootstrap/datepicker' to import { BsDaterangepickerDirective } from 'ngx-bootstrap-base/src

I have a form which contain a date picker / calender, email, city name and hotel name, I want a user to select a date and enter other fields and submit the data. This is what I have. HTML: <form [formGroup]="angForm" class="form-element"> <div class="form-group"> <label for="dateOfBirth">Date of Birth</label> <input id="dateOfBirth" name="dateOfBirth" [(ngModel)]="dateOfBirth" type="text" bsDatepicker class="form-control" /> </div> <div class="form-group form-element_email"> <input type="email" class="form-control info" placeholder="Email" formControlName="email" #email (ngModelChange)=

Bootstrap navbar doesn't exist in the ngx-bootstrap components list. Please help me to implement it. There's no implementation of navbar as a separate component but it can be done with Collapse Module. Example = https://stackblitz.com/edit/ngx-bootstrap-rc8ab4?file=app%2Fapp.component.ts MODULE // App imports import { NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import { AppComponent } from './app.component'; import { CollapseModule } from 'ngx-bootstrap/collapse'; @NgModule({ imports: [ BrowserModule, CollapseModule.forRoot()], declarations: [

In my Angular 4 app, let's assume that I'm inside a service. At some point I want to ask to the user for a confirmation, currently I'm doing it with just a confirm(...) request: const result = confirm('Are you sure?'); what if instead I would like to show a ngx-bootstrap modal with, let's say, two buttons "Yes" or "No" and obtain a similar result? EDIT : in my case, I solved my issue by playing with Subjects. Here you can find my solution, in case it can be useful for someone else. However that solution does not solve this question which is about returning a value from a modal, so I leave it

In my Angular 4 application I have some components with a form, like this: export class MyComponent implements OnInit, FormComponent { form: FormGroup; ngOnInit() { this.form = new FormGroup({...}); } they use a Guard service to prevent unsubmitted changes to get lost, so if the user tries to change route before it will ask for a confirmation: import { CanDeactivate } from '@angular/router'; import { FormGroup } from '@angular/forms'; export interface FormComponent { form: FormGroup; } export class UnsavedChangesGuardService implements CanDeactivate<FormComponent> { canDeactivate(component: