ng-bootstrap-fork2
Advanced tools
Welcome to the Angular version of the Angular UI Bootstrap library. This library is being built from scratch by the ui-bootstrap team. We are using TypeScript and targeting the Bootstrap 4 CSS framework.
As with Bootstrap 4, this library is a work in progress. Please check out our list of issues to see all the things we are implementing. Feel free to make comments there.
View all the directives in action at https://ng-bootstrap.github.io
After installing the above dependencies, install ng-bootstrap via:
npm install --save @ng-bootstrap/ng-bootstrap
Once installed you need to import our main module:
import {NgbModule} from '@ng-bootstrap/ng-bootstrap';
The only remaining part is to list the imported module in your application module. The exact method will be slightly
different for the root (top-level) module for which you should end up with the code similar to (notice NgbModule.forRoot()):
import {NgbModule} from '@ng-bootstrap/ng-bootstrap';
@NgModule({
declarations: [AppComponent, ...],
imports: [NgbModule.forRoot(), ...],
bootstrap: [AppComponent]
})
export class AppModule {
}
Other modules in your application can simply import NgbModule:
import {NgbModule} from '@ng-bootstrap/ng-bootstrap';
@NgModule({
declarations: [OtherComponent, ...],
imports: [NgbModule, ...],
})
export class OtherModule {
}
If you are using SystemJS, you should also adjust your configuration to point to the UMD bundle.
In your systemjs config file, map needs to tell the System loader where to look for ng-bootstrap:
map: {
'@ng-bootstrap/ng-bootstrap': 'node_modules/@ng-bootstrap/ng-bootstrap/bundles/ng-bootstrap.js',
}
We support the same browsers and versions supported by both Bootstrap 4 and Angular, whichever is more restrictive. See this for up-to-date Angular browser support.
Also check Bootstrap 4's notes on browsers support.
Please check the CONTRIBUTING.md doc for contribution guidelines.
Please, do not open issues for the general support questions as we want to keep GitHub issues for bug reports and feature requests. You've got much better chances of getting your question answered on StackOverflow where maintainers are looking at questions tagged with ng-bootstrap.
StackOverflow is a much better place to ask questions since:
To save your and our time we will be systematically closing all the issues that are requests for general support and redirecting people to StackOverflow.
Oh, we are ashamed and want to fix it ASAP! But before fixing a bug we need to reproduce and confirm it. In order to reproduce bugs we will systematically ask you to provide a minimal reproduction scenario using http://plnkr.co. Having a live, reproducible scenario gives us wealth of important information without going back & forth to you with additional questions like:
A minimal reproduce scenario using http://plnkr.co/ allows us to quickly confirm a bug (or point out coding problem) as well as confirm that we are fixing the right problem. The best part is that you do not need to create plunks from scratch - you can fork one from our demo page.
We will be insisting on a minimal reproduce scenario in order to save maintainers time and ultimately be able to fix more bugs. Interestingly, from our experience users often find coding problems themselves while preparing a minimal plunk. We understand that sometimes it might be hard to extract essentials bits of code from a larger code-base but we really need to isolate the problem before we can fix it.
Unfortunately we are not able to investigate / fix bugs without a minimal reproduce scenario using http://plnkr.co, so if we don't hear back from you we are going to close an issue that don't have enough info to be reproduced.
Please take a moment and read our Code of Conduct
2.0.0 (2018-05-04)
This is a major release of ng-bootstrap. It is fully compatible with Angular / RxJS 6.x. Please pay attention to the breaking changes section when upgrading.
NgbDatepickerI18n implementation, you'll have to implement an additional method: getDayAriaLabel(date: NgbDateStruct): string. It returns the string that will be set for the aria-label attribute for each displayed day. If you're not using the custom service, the aria-label will default to the value returned by the angular DatePipe with 'fullDate' format..focus() method will now only focus one day and not the whole component.<a name="1.1.1"></a>
FAQs
Fork of Angular powered Bootstrap
The npm package ng-bootstrap-fork2 receives a total of 0 weekly downloads. As such, ng-bootstrap-fork2 popularity was classified as not popular.
We found that ng-bootstrap-fork2 demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Fluent Assertions is facing backlash after dropping the Apache license for a commercial model, leaving users blindsided and questioning contributor rights.
Research
Security News
Socket researchers uncover the risks of a malicious Python package targeting Discord developers.
Security News
The UK is proposing a bold ban on ransomware payments by public entities to disrupt cybercrime, protect critical services, and lead global cybersecurity efforts.