Questions tagged mdbootstrap

Explore the latest questions and answers asked by our top developers.

Mdbootstrap5(v12.1.0) is not working in my angular12 project

I have installed mdbootstrap5 using ng add angular-bootstrap-md in my angular12 project. package.json { "name": "client", "version": "0.0.0", "scripts": { "ng": "ng", "start": "ng serve", "build": "ng build", "watch": "ng build –watch –configuration development", "test": "ng test" }, "private": true, "dependencies": { "@angular/animations": "~12.0.0", "@angular/cdk": "^9.0.0", "@angular/common": "~12.0.0", "@angular/compiler": "~12.0.0", "@angular/core": "~12.0.0", "@angular/forms": "~12.0.0", "@angular/platform-browser": […]

By Fahad Subzwari
Categorized as angular, mdbootstrap Tagged ,

Disable other checkboxes when some of them are selected using angular mbdootstrap

I have code HTML like this: <form [formGroup]="form"> <mdb-checkbox class="checkboxes-text checkbox-custom" formControlName="A" [filledIn]="true"> <span>A</span> </mdb-checkbox> <mdb-checkbox class="checkboxes-text checkbox-custom" formControlName="B" [filledIn]="true"> <span>B</span> </mdb-checkbox> <mdb-checkbox class="checkboxes-text checkbox-custom" formControlName="none" [filledIn]="true"> <span>none</span> </mdb-checkbox> </form> and I have typescript code: this.form.valueChanges.subscribe(response => { console.log("response: ", response); if (response.A || response.B) { this.form.get(‘none’).disable(); console.log("here"); } }) Unfortunatelly, it doesn’t work as […]

By monika
Categorized as angular, disable, mdbootstrap Tagged , ,

Nav bar content hidden on large screen

I’m using Mdbootstrap 5 for my angular web app and I have a trouble with Navbar component. I just copy/paste the first "Basic example" (, and on large screen the nav bar content is not displayed. But when I reduce the screen until I show the toggle button and I click on it, nav bar […]

By LilFlowtante
Categorized as angular, bootstrap-5, mdbootstrap Tagged , ,

Can’t import mdb-ui-kit modules in Angular project

npm version: 6.14.13 nodejs version: 14.17.3 mdb-ui-kit version: 3.9.0 Hi there, I installed mdb-ui-kit as written here with NPM terminal command npm i mdb-ui-kit and I managed to use the package’s CSS when importing with @import ‘~mdb-ui-kit/css/mdb.min.css’;. But when I try to import a mdb module like so : import { Input } from ‘mdb-ui-kit’; […]

By Pommepomme
Categorized as angular, mdbootstrap, node.js, npm Tagged , , ,

remove padding from accordion

I have a mdbootstrap accordion inside an angular component. By default, it has some padding. I wish to make it smaller. From inspecting the accordion I see that it’s made out of a button that has the padding. So in the .scss file of the component where I use the accordion, I do: accordion-button { […]

By Royi Levy
Categorized as angular, mdbootstrap Tagged ,

What am I doing that is successfully allowing my nav bar to open when hamburger icon is clicked… but is not making it close?

This is an issue in an angular project, and for it I am using the standard version of mdboostrap5. I can’t figure out why the nav bar will go down, but then will not go back up when the hamburger menu icon is clicked. Here is the code: <header class="mb-auto header-spacing"> <nav class="navbar navbar-expand-lg navbar-light […]

By user10381291
Categorized as angular, mdbootstrap, nav Tagged , ,

How to get the active tab in mdb-tabset in angular?

I have an mdb-tabset which has two mdb-tabs with heading ‘Frist Tab’ and ‘Second Tab’. Now I want to know which one is active and get it’s name or id in order to access it in the component. I have this selectedTab: string = ”; in my component. I want to get the active selectedTab […]

By Jayashri
Categorized as angular, angularjs, html, mdbootstrap Tagged , , ,

How can I manually mark an input in my mdbootstrap angular.js form as invalid?

With my current code I am able to make inputs show up as invalid if they are blank or do not fit the format of the input’s type (eg: email must have the ‘@’ and ‘.’ format). My next step is to make sure the password and confirmPassword fields match up. I have created a […]

By user10381291
Categorized as angular, mdbootstrap, typescript Tagged , ,

How to have search option with dropdown in angular reactive form

As I have long list of options, I want to implement the search option that will filter the options in dropdown. I went through the google search and have got 2 examples. Not sure which to use and why? Or is there any other way to implement the above functionality. Link of examples I referred […]

Overrif ngOnDestroy method of a Directive

I use the mdb-pro library and in particular the TabSetComponent. I have a problem with the ngondestroy function of TabDirective. This one realizes : this.tabset.removeTab(this); I would like to know if there is a way to override the ngondestroy function of the TabDirective to prevent the tab from being removed. Thanks Source: Angular Questions

By CarouselAnim
Categorized as angular, directive, mdbootstrap Tagged , ,
1 3

Still Have Questions?

Our dedicated development team is here for you!

We can help you find answers to your question for as low as 5$.

Contact Us