0% found this document useful (0 votes)
65 views

Angular Bootstrap: Manual Installation

This document provides information about the dependencies, installation, and usage of the ng-bootstrap library for Angular. It states that ng-bootstrap requires Angular and Bootstrap CSS, and lists the supported versions. It recommends using the Angular CLI to set up new projects and provides commands for adding ng-bootstrap via schematics or manually. The document also covers internationalization, support, contributing, and licensing.

Uploaded by

norbertonorberto
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
65 views

Angular Bootstrap: Manual Installation

This document provides information about the dependencies, installation, and usage of the ng-bootstrap library for Angular. It states that ng-bootstrap requires Angular and Bootstrap CSS, and lists the supported versions. It recommends using the Angular CLI to set up new projects and provides commands for adding ng-bootstrap via schematics or manually. The document also covers internationalization, support, contributing, and licensing.

Uploaded by

norbertonorberto
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 3

Menu

The only two required dependencies are Angular and Bootstrap CSS. The supported versions are:

ng-bootstrap Angular Bootstrap CSS

1.x.x 5.0.2 4.0.0

2.x.x 6.0.0 4.0.0

3.x.x 6.1.0 4.0.0

4.x.x 7.0.0 4.0.0

5.x.x 8.0.0 4.3.1

6.x.x 9.0.0 4.4.1

7.x.x 10.0.0 4.5.0

We strongly recommend using Angular CLI for setting up a new project. If you have an Angular ≥ 9 CLI project, you could simply use
our schematics to add ng-bootstrap library to it.

Just run the following:

ng add @ng‐bootstrap/ng‐bootstrap

It will install ng-bootstrap for the default application specified in your angular.json. If you have multiple projects and you want to
target a specific application, you could specify the ‐‐project option

ng add @ng‐bootstrap/ng‐bootstrap ‐‐project myProject

Manual installation
If you prefer not to use schematics or want to add ng-bootstrap to an older project, you'll need to do the following:

Add bootstrap and @ng‐bootstrap/ng‐bootstrap dependencies from npm


Install the @angular/localize polyfill
Add bootstrap CSS/SCSS to your project (no javascript is required)
Import NgbModule or any other component module like NgbPaginationModule in your application

Click here to show detailed instructions

Instead of importing the whole library with NgbModule, you could only import modules with components you need, ex. pagination and
alert.
Downloads Nueva transferencia.pdf Nueva transferencia1.pdf AngularCourses-master.zip 100% Clear

1 de 3 16/09/2020 22:08
The resulting bundle will be smaller in this case.

import {NgbPaginationModule, NgbAlertModule} from '@ng‐bootstrap/ng‐bootstrap';

@NgModule({
  imports: [NgbPaginationModule, NgbAlertModule],
})
export class YourAppModule {
}

We strive to support the same browsers and versions as supported by both Bootstrap and Angular, whichever is more restrictive.
Check browser support notes for Angular and Bootstrap.

Our code is automatically tested on all supported browsers.

We're using standard Angular i18n in ng-bootstrap templates. Since Angular 9 (and ng-bootstrap 6) you have to add the
additional @angular/localize polyfill to your CLI project. See more details in the official documentation.

Some components contain static English text or symbols that you might want to internationalize. Some of them appear on the screen,
like for example the placeholders used in the timepicker input fields. Others appear in aria attributes used for accessibility.

Internationalizing the ng-bootstrap components is done the same way as for any of your components, using the process described in
the Angular documentation. The only difference is that we already did the first phase of this process: marking static text messages in
the ng-bootstrap component templates for translation.

So, if you execute `ng xi18n` on your project, you will also find the ng-bootstrap messages to translate in the generated messages file.
All our messages are identified by an ID of the form ngb.[widget].[message]

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 the community at large are looking at
questions tagged with ng‐bootstrap.

StackOverflow is a much better place to ask questions since:

there are hundreds of people willing to help on StackOverflow,


questions and answers stay available for public viewing so your question / answer might help someone else, and
the SO voting system assures that the best answers are prominently visible.

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.

We are always looking for the quality contributions! Please check the Contributing doc for contribution guidelines. Additionally, for
local building and testing information, please see our Developer's Guide.

Please take a moment to read our Code of Conduct.

Downloads Nueva transferencia.pdf Nueva transferencia1.pdf AngularCourses-master.zip 100% Clear

2 de 3 16/09/2020 22:08
Designed and built by the ng-bootstrap team with the help of our contributors.
Code licensed under MIT license conditions.
Documentation licensed under CC BY 3.0. Design and content of the documentation site heavily inspired by the original Bootstrap design.
Icons made by Iconmonstr

Downloads Nueva transferencia.pdf Nueva transferencia1.pdf AngularCourses-master.zip 100% Clear

3 de 3 16/09/2020 22:08

You might also like