ng-bootstrap

ng-bootstrap modal is not displaying

由 萝らか妹 提交于 2019-12-05 07:31:30
Am using ng-bootstrap modal in my application to show dialogue box. but while clicking the button, nothing is happening, the modal is not displaying. while debugging it could find that the action is getting called, but the modal is not showing. this is my app.module.ts import {NgModule } from '@angular/core'; import {BrowserModule } from '@angular/platform-browser'; import {TaskService} from '../app/task/task.service'; import {TaskComponent} from '../app/task/task.component'; import {AppComponent } from './app.component'; import {FormsModule ,ReactiveFormsModule} from '@angular/forms'; import

How to Style ng-bootstrap - Alternative to /deep/

由 会有一股神秘感。 提交于 2019-12-04 23:56:55
问题 I am using the accordion component from ng-bootstrap in one of my apps and the /deep/ (aka: ::ng-deep and >>> ) selector to set its styles. However I saw this selector has been deprecated. Is there an alternative to set the styles of the ng-bootstrap components? 回答1: Support for the emulated /deep/ CSS Selector (the Shadow-Piercing descendant combinator aka >>>) has been deprecated to match browser implementations and Chrome’s intent to remove. ::ng-deep has been added to provide a temporary

Getting started Angular2 RC5 with ng-bootstrap 404 Error

由 不打扰是莪最后的温柔 提交于 2019-12-04 17:58:16
I have followed the instructions for installation on the ng-bootstrap website with a fresh git clone of Angular2, but receive a 404 Error when NgbModule is in the import array of @NgModule . Screencap of error: 404 Error loading @ng-bootstrap Steps: Cloned Angular2's quickstart git repo github.com/angular/quickstart Edit app.module.ts to the following: import { NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import { AppComponent } from './app.component'; import { NgbModule } from "@ng-bootstrap/ng-bootstrap"; @NgModule({ imports: [ NgbModule,

ng-bootstrap not working in angular 4

由 北城以北 提交于 2019-12-04 16:27:54
问题 I am new with angular 4, I am trying to configure bootstrap. I installed ng-bootstrap: https://ng-bootstrap.github.io/#/getting-started I did all like on the page, but I don't see the bootstrap on my page. Here is my code: src/app/app.module.ts import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { AppComponent } from './app.component'; import { FormsModule } from '@angular/forms'; import {NgbModule} from '@ng-bootstrap/ng-bootstrap';

angular 2 ng-bootstrap datepicker popup

由 人走茶凉 提交于 2019-12-04 05:57:00
Hi I am investigating on ng-bootstrap datepicker. I looked at the demo code and was able to get it to work in my application. However, if I added more than 1 datepicker input tags, only one is working. Below are the code I created. I tried to change the #d to #d1 and #d2 (also change the toggle() part) and the page spits out errors. <div class="input-group"> <input class="form-control" placeholder="yyyy-mm-dd" name="dp" [(ngModel)]="newItem.EndTime" ngbDatepicker #d="ngbDatepicker" required> <div class="input-group-addon" (click)="d.toggle()" > <i class="fa fa-calendar" aria-hidden="true"></i>

How to mark ngbDatepicker Valid in form even when no value is selected

由 流过昼夜 提交于 2019-12-04 03:52:04
问题 I'm making use of ng-bootstrap's ngbDatepicker in a Reactive Form in an Angular2 project, and the dates are optional, however ngbDatepicker always marks the form as Invalid unless a date is selected. Is there a way to exclude ngbDatepicker from the form validation, or to configure it so that it returns Valid whether it has a value set or not? 回答1: The issue was with how I was initializing the form values. I was setting the default values to empty strings where I should have been initializing

Angular 2 ng bootstrap typehead pass additional parameter

由 我们两清 提交于 2019-12-04 02:17:49
问题 How to pass form array index to getCities function in ng-bootstrap typehead including current input text. Consider 3 is form array index. address.component.html <input name="city" type="text" id="city" formControlName="city" [ngbTypeahead]="getCities"> address.component.ts getCities = (text$: Observable<string>) => text$ .debounceTime(300) .distinctUntilChanged() .switchMap(query => query.length < 2 ? [] : this.apiService.getCities(query).catch(() => { return Observable.of([]); });) 回答1: It

Why would you ever call .call() on Observable functions?

由 浪尽此生 提交于 2019-12-04 00:57:37
问题 I am a relative beginner in Angular, and I am struggling to understand some source I am reading from the ng-bootstrap project. The source code can be found here. I am very confused by the code in ngOnInit: ngOnInit(): void { const inputValues$ = _do.call(this._valueChanges, value => { this._userInput = value; if (this.editable) { this._onChange(value); } }); const results$ = letProto.call(inputValues$, this.ngbTypeahead); const processedResults$ = _do.call(results$, () => { if (!this.editable

How to configure NgbDropdown to display the selected item from the dropdown

由 99封情书 提交于 2019-12-04 00:23:06
问题 In ng-bootstrap NgbDropdown, how would you display the text of the selected button so that what ever item the user selects replaces the default text initially shown? In the example below, the goal is to display whatever sorting option the user selects. <div ngbDropdown class="d-inline-block"> <button class="btn btn-outline-primary" id="sortMenu" ngbDropdownToggle>Sort by...</button> <div class="dropdown-menu" aria-labelledby="sortMenu"> <button class="dropdown-item">Year</button> <button

How to add ng-bootstrap to an Angular-CLI (Broccoli version) project?

由 微笑、不失礼 提交于 2019-12-03 20:14:41
问题 How to add ng-bootstrap (by written by the angular-ui team) to an Angular-CLI (Angular2 RC4) project? More specifically: How should I add the minified .css from my node_modules folder to my angular-cli project? Do I have to add it to angular-cli-build.js ? Do I have to add the typings? Do I have to add it to /src/system-config.ts 回答1: Yes you have to add all of your css files by referencing from vendorNpmFiles in angular-cli-build.js file First go to the project directory and type npm install
订阅 ng-bootstrap