MDB Angular Free
MDB Angular Pro
Newsletter
Would you like to be notified about next update ?
Subscribe to our newsletter Note: We are transitioning MDB4 into a legacy version. We encourage MDB4 users to
migrate to MDB5 and take advantage of a 50% discount on MDB5 PRO. You can find more information here.
get 50% discount on MDB5 PRO
Angular FAQ & Known issues
Due to fact that Angular 7 and CLI 7 are dynamically developed and minor issues occur we have created list of Frequently Asked Questions and/or issues with solutions/workarounds.
MDB Angular 15.0.0
Release date: 2023-02-20
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
This version requires Angular v15. Follow the Angular update guide to migrate your project to Angular 15.
Breaking changes:
- Added support for Angular 15, this Angular version is now required.
Fixes and improvements:
- Navbar - resolved problem with height of collapsed component on initialization,
- Navbar - resolved problem with height of expanded menu on component initialization and window resize,
- Sidenav - resolved problem with sidenav mask size in component with dynamic content.
MDB Angular 14.0.0
Release date: 2022-10-24
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
This version requires Angular v14 and Node 14.15.0 (or later). Follow the Angular update guide to migrate your project to Angular 14:
Breaking changes:
- Added support for Angular 14, this Angular version is now required,
- Replaced
agm/core
library withangular/google-maps
in Admin Template applications, - Stepper - replaced step icon generated by CSS styles with HTML element (this change resolves problem with displayed step numbers in Safari browser),
Fixes:
- Stepper - resolved problem with dynamic updates of invalid step icon,
- Modal - resolved problem with closing when mouseup event is detected outside the component,
- WYSIWYG plugin - resolved problems with
insert link
method, - Calendar plugin - resolved problems with long events display,
- Sortable plugin - resolved problem with page scrolling in mobile browsers.
MDB Angular 13.0.0
Release date: 2022-03-21
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 13.0.0 we added support for Angular 13 and Font Awesome 6. Check what changed below:
Breaking changes:
- Added support for Angular 13, this Angular version is now required,
- Checkbox - changed
id
input name tocheckboxId
, - Checkbox - styles will be loaded with other core global styles. This will allow you to use checkbox not only as
mdb-checkbox
component, but also as a standard HTML element with material styles. Themdb-checkbox
offers more features but can cause some performance problems after adding many elements in one application view.
Dependencies:
- Updated Font Awesome to v6.0.0.
Fixes:
- Added type coercion for boolean and number inputs to resolve problems with inputs types,
- Select - resolved problem with option type.
MDB Angular 12.2.0
Release date: 2022-01-17
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 12.2.0 we updated Bootstrap to v4.6.1 and added some fixes and new features for the existing components. Check what changed below:
Dependencies:
- Updated Bootstrap styles to version 4.6.1
Fixes:
- Sidenav - resolved problem with error when
[side]="'right'"
input is used, - Sidenav - resolved problem with short animation on component load, the component should be now displayed in its default state for specific breakpoint without visible transition on initialization,
- Carousel - resolved problem with emitting
activeSlideChange
multiple times, - File upload plugin - query string will be now correctly removed from
[defaultFile]
url.
New features:
- Select - added new
inputFocus
andinputBlur
events that will be emitted on select input focus/blur.
MDB Angular 12.1.0
Release date: 2021-11-22
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 12.1.0 we added some fixes and new features for the existing components. Check what changed below:
Fixes:
- Datepicker -
markWeekends
option will no longer mark dates that are hidden in a specific view, - Tooltip - resolved problem with component reopening when
delay
option is used, - Calendar plugin - resolved problems with reponsiveness,
- Calendar plugin - resolved problem with view updates on
startDate
input changes,
New features:
- Calendar plugin - added new unique classes for toolbar container and elements inside the toolbar,
- Calendar plugin - added new viewChanged output.
MDB Angular 12.0.0
Release date: 2021-08-23
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 12.0.0 we added support for Angular 12. This update introduces breaking changes, check what changed below:
Breaking changes:
- MDB Angular 12 requires Angular v12,
Fixes:
- Carousel - resolved problem with gap between thumbnail bar and image,
- Autocomplete - resolved problem with type of option value input,
- Timepicker - resolved problem with setting default value using Angular form controls,
- Datepicker - resolved problem with display in inline mode when container has
overlay: hidden
styles, - Datepicker - focus on input with
openOnFocus
option will no longer remove body scroll, - Stepper - added possibility to jump to any step if previous steps are completed,
- Lightbox - resolved problem with background scrolling when image is opened,
- Multi-range - resolved problem with component styles in Firefox browser,
- Multiselect - resolved problem with error displayed on component value initialization,
- Spinner - removed unused selector to avoid naming collisions with other libraries.
New features:
- Table - input
maxHeight
will also accept values with different units (for example80%
)
MDB Angular 11.1.0
Release date: 2021-05-10
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 11.1.0 we added some fixes and new features for the existing components. Check what changed below:
If you want to upgrade from MDB 10 version, please read our migration guide:
MDB Angular Migration GuideFixes:
- Popover - component will not be displayed if no content is provided,
- Datepicker - resolved problem with label active state and opening component on label click (inline mode),
- Datepicker - component in modal mode will not open on input click if
openOnFocus
input is set tofalse
, - Collapse - resolved problem with animation, component will not be toggled if animation is not finished,
- Autocomplete - resolved problem with input keydown listener in Firefox browser when
appendToBody
option is enabled, - Stepper - resolved problem with HTML template updates on step input change,
- Calendar plugin - added the
CalendarView
type to the exports list.
New features:
- Popover - added new
[popoverDisabled]
input that allow to disable component, - Navbar - added new
(shown)
and(hidden)
outputs, - Sidenav - added new
(shown)
and(hidden)
outputs.
MDB Angular 11.0.0
Release date: 2020-03-08
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 11.0.0 we added support for Angular 11. This update introduces breaking changes, check what changed below:
If you want to upgrade from MDB 10 version, please read our migration guide:
MDB Angular Migration GuideBreaking changes:
- MDB Angular 11 requires Angular v11,
Fixes:
- Select 2 - resolved problem with using false values as option values,
- Autocomplete - resolved problem with disabled state in reactive forms,
- Autocomplete - resolved problem with closing component dropdown on document click,
- Range - resolved problem with thumb animations,
- Multi-range - resolved problem with component styles in Firefox browser.
MDB Angular 10.1.1
Release date: 2020-11-30
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 10.1.1 we added some new features and fixes for the existing components, check what changed below:
If you want to upgrade from MDB 9 version, please read our migration guide:
MDB Angular Migration GuideFixes:
- Input group - resolved problem with z-index of outline input label,
- Accordion/Sidenav - resolved problem with auto expand on route change,
- Textarea - fixed label validation styles in outline version,
New features:
- Radio - added new
disabled
input formdbRadio
directive. - Calendar plugin - added new
startDate
input that allow to set default date.
MDB Angular 10.0.1
Release date: 2020-11-23
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 10.0.1 we added some fixes for the existing components, check what changed below:
If you want to upgrade from MDB 9 version, please read our migration guide:
MDB Angular Migration GuideFixes:
- Badge - resolved problems with input responsible for adding background color,
- File Upload - added
UploaderOptions
to the exports list, - Accordion - fixed problem with input label position,
- Range - resolved problem with value updates when using
ngModel
, - Timepicker - resolved problems with layout after change in HTML font size.
MDB Angular 10.0.0
Release date: 2020-09-21
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 10.0.0 we added support for Angular 10. This update introduces breaking changes, check what changed below:
If you want to upgrade from MDB 9 version, please read our migration guide:
MDB Angular Migration GuideBreaking changes:
- MDB Angular 10 requires Angular v10,
- Tooltip - changed name of the
isDisabled
input totooltipDisabled
to avoid naming collisions with the inputs of other components, - Select, Autocomplete - adjusted appearance of arrow icon and clear buttons to maintain a consistent design in all form controls.
Fixes:
- Select 2 - resolved problem with setting initial value with
ngModel
New features:
- Select 2 - added new
label
input formdb-select-option
component. If the input value is available, it will be displayed in the select input after option selection.
MDB Angular 9.4.0
Release date: 2020-08-31
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 9.4.0 we added some new features and fixes for the existing components, check what changed below:
If you want to upgrade from MDB 8 version, please read our migration guide:
MDB Angular Migration GuideFixes:
- Datepicker - resolved problems with styles when component is opened inside accordion,
- Datepicker - resolved problem with clearing input value with Angular form controls methods,
- Datepicker - resolved problem with dynamic updates of year and month select values,
- Sidenav - component should no longer close on viewport height change,
- Select 2 - dropdown height will be correctly updated for specific
visibleOptions
value, - Select 2 - resolved problem with dropdown visibility when the component is opened inside a modal,
- Select 2 - resolved problem with resetting value with Angular form controls methods,
- Select 2 - adjusted styles to match other form controls,
- Badge - color classes will be correctly assigned to the component,
- Radio - native radio elements styles will no longer be overridden by MDB styles,
- Autocomplete - resolved problem with setting component value when value is an object,
- Tabs - resolved problem with active tab initialization for tabs created dynamically,
- Textarea - component height will be correctly initialized when used inside tab,
- Stepper - resolved problem with active step update after adding or removing steps dynamically,
- Dropdown - resolved problems with performance,
- Select - resolved problem with value changes when using form control methods,
- Table Editor - first row will be now correctly highlighted,
- Wysiwyg - resolved problem with editing url of the link.
New features:
- Datepicker - added new
inputIcon
andinlineInputIcon
options, which allow to show and hide toggle icons for specific display mode, - Autocomplete - added new
dropdownPosition
input, which allow to specify the dropdown position (below, above, auto). Default position is set to'auto'
.
MDB Angular 9.3.1
Release date: 2020-05-25
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 9.3.1 we added some fixes for the existing component, check what changed below:
If you want to upgrade from MDB 8 version, please read our migration guide:
MDB Angular Migration GuideFixes:
- Sidenav - resolved problem with SSR in Angular Universal,
- Stepper - resolved problem with adding steps dynamically,
- Multiselect- resolved problem with setting default value,
- Select 2 - resolved problem with label position update when setting default value.
MDB Angular 9.3.0
Release date: 2020-05-11
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 9.3.0 we added some fixes and a new version of Select component, check what changed below:
If you want to upgrade from MDB 8 version, please read our migration guide:
MDB Angular Migration GuideFixes:
- Select - resolved problem with tabindex attribute,
- Modals - resolved problems with focus trap.
New features:
- Added new version of Select component, which includes new
mdb-option
component, updated material design and modified HTML structure. The old version of this component is still available and will not be removed before the next major release.
MDB Angular 9.2.0
Release date: 2020-04-27
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 9.2.0 we added some fixes and a new version of Timepicker component, check what changed below:
If you want to upgrade from MDB 8 version, please read our migration guide:
MDB Angular Migration GuideFixes:
- Select - resolved problem with
documentElement
in Angular Universal, - Outline input - resolved problem with styles of prefix icon.
New features:
- Added new version of Timepicker component, which includes new features and updated material design. The old version of this component is still available and will not be removed before the next major release.
MDB Angular 9.1.0
Release date: 2020-04-14
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 9.1.0 we added some fixes for sidenav and new features for tables, check what changed below:
If you want to upgrade from MDB 8 version, please read our migration guide:
MDB Angular Migration GuideFixes:
- Sidenav - component in fixed mode will not be closed when viewport height change,
- Sidenav - resolved problem with backdrop animation transition when component is opened for the first time,
- Table - added few fixes to the styles to better match the material design look.
New features:
- Table sort - added new
[sortIcon]
input. Set value of this input totrue
to automatically add sort icons to the component template, - Table sort - added new
resetSortDirection
input. When set to true, every third click on sort icon will reset sorting direction. This feature will be used as default sorting method in MDB Angular v10, - Table - added new
[stickyFooter]
,[stickyFooterBgColor]
and[stickyFooterColor]
inputs that allow to create and customize sticky footer.
Docs:
- Table - added new example with checkboxes and row selection.
MDB Angular 9.0.1
Release date: 2020-03-30
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 9.0.1 we added some fixes for components and SSR, check what changed below:
If you want to upgrade from MDB 8 version, please read our migration guide:
MDB Angular Migration GuideFixes:
- Dynamic modal - resolved problem with
Can't bind to 'role' since it isn't a known property of 'null'
warning, - Datepicker - resolved problem with footer dynamic position changes when switching between months,
- Switch - resolved problem with overflow styles
- Universal (server side rendering) - resolved problem with
KeyboardEvent is not defined
error.
Docs:
- Added new guide on how to use Angular Universal in Angular 9 app.
MDB Angular 9.0.0
Release date: 2020-03-09
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 9.0.0 we added support for Angular 9. This update introduces breaking changes, check what changed below:
If you want to upgrade from MDB 8 version, please read our migration guide:
MDB Angular Migration GuideBreaking changes
- MDB Angular requires Angular v9, but it's still possible to opt-out of Ivy,
- MDB Angular now requires
@angular/cdk
package, - Roboto font files are no longer included in the library files and should be loaded from external source.
Read our migration guide to learn how to migrate your project correctly.
Fixes:
- WYSIWYG plugin - resolved problem with bold/unbold methods and duplicated elements,
- Calendar plugin - adding new events will be blocked if the 'editable' input is set to false.
New features:
- Updated Bootstrap to version 4.4.1,
- Added Angular Schematics for version pro and resolved problems with Schematics in version free.
MDB Angular 8.10.1
Release date: 2020-03-02
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 8.10.1 we added bug fixes for WYSIWYG plugin and new guide for styles customization. Check what changed below:
If you want to upgrade from MDB 7 version, please read our migration guide:
MDB Angular Migration GuideFixes
- WYSIWYG plugin - resolved problem with
Cannot read property parentElement of null
error, - WYSIWYG plugin - resolved problem with resetting value in reactive forms.
Docs
- Added new guide for styles customization.
MDB Angular 8.10.0
Release date: 2020-02-17
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 8.10.0 we added some bug fixes and new features for the existing components. Check what changed below:
If you want to upgrade from MDB 7 version, please read our migration guide:
MDB Angular Migration GuideFixes
- Carousel -
selectSlide
method will work correctly even if animation type is not specified, - Datepicker - resolved problem with setting disabled state in reactive forms (modal version),
- Textarea - resolved problem with auto resize for default value,
- Select/Multiselect - resolved problem with background color of highlighted option in colorful select,
- Select/Multiselect - resolved problem with position of value text in outline mode.
New features
- Carousel - added new
[allowSwipe]
input that allow to enable/disable swipe gestures, - Icon - added support for Font Awesome Pro Duotone Icons.
MDB Angular 8.9.0
Release date: 2020-02-03
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 8.9.0 we added some fixes and features for the existing components. Check what changed below:
If you want to upgrade from MDB 7 version, please read our migration guide:
MDB Angular Migration GuideFixes
- Validation - resolved problem with styles of outline inputs,
- Select - adjusted outline input height to the height of the inputs in other form controls,
- Stepper -
(stepChange)
event will not be emitted for disabled steps, - Datepicker - resolved problems with global options,
- Autocomplete - fixed dropdown bottom position in outline mode,
- Timepicker - component will now return new value and change event when clear method is used,
- Checkbox - resolved problem with label styles (removed unnecessary
overflow
andwhite-space
properties), - Sidenav - resolved problem with styles of the links with waves effect,
- Sortable plugin - input/textarea funcitonality will no longer be blocked by the sortable directive,
- Sidenav/Accordion - added checks for window object to resolve problems with server side rendering.
New features
- Dropdown - added new
dynamicPosition
input, when this option is active component will dynamically update dropdown position (if the menu does not fit the viewport), - Timepicker - added possibility to add custom styles for footer and AM/PM buttons and custom translation to buttons,
- Timepicker - added possibility to add new button that will clear the current selected value.
MDB Angular 8.8.2
Release date: 2020-01-20
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 8.8.2 we added some fixes for the existing components and removed duplicated css styles. Check what changed below:
If you want to upgrade from MDB 7 version, please read our migration guide:
MDB Angular Migration GuideFixes
- Styles - removed duplicated code,
- Toast - resolved problem with box-shadow styles on hover,
- Table - removed unecessary styles from
a
elements, - Table sort - slightly improved performance,
- Validation - prefix icons will get correct validation color styles (success/error),
- Validation - fixed position of validation messages,
- Sidenav - will not be closed when viewport height change,
- Select - will not be overlapped by table header with
sticky-top
class, - Pills - removed unecessary shadow styles on hover,
- Static modal - backdrop will be added/removed correctly when config value change,
- Calendar plugin - fixed parameter name in object emitted by
(monthChanged)
output.
MDB Angular 8.8.1
Release date: 2019-12-23
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 8.8.1 we added some fixes for the existing components and small update for the calendar plugin. Check what changed below:
If you want to upgrade from MDB 7 version, please read our migration guide:
MDB Angular Migration Guide1. Fixes
- Inputs - resolved problem with styles of long label,
- Datepicker inline - clicking on the icon won't open the disabled component,
- Textarea - resolved problem with position of validation message,
- Textarea - active styles for prefix icon will be applied correctly,
- Search - resolved problem with the icon position when the input is inside container with
.md-form
class, - Autocomplete - clear button will be added correctly if default value is set,
- Admin Template Pro - resolved problem with styles of images that use waves effect,
- Admin Template Pro - resolved problem with styles of icons in the sidenav.
2. Plugins:
- Calendar - added new
[defaultView]
input that allow to set default view for the component (week/month/list).
MDB Angular 8.8.0
Release date: 2019-12-09
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 8.8.0 we added some fixes and new tree view component. Check what changed below:
If you want to upgrade from MDB 7 version, please read our migration guide:
MDB Angular Migration Guide1. Fixes
- Sticky header - resolved problem with navbar
z-index
, - Table search/Table editor - resolved problem with filtering when a property value is null,
- Datepicker - resolved problem with setting
minYear
andmaxYear
options, - Select - clear button will no longer be displayed if no option is selected,
- Timepicker - component view will be now updated correctly on form control value change,
- Color picker plugin - resolved problem with displaying wrong rgba color on component initialization,
- Resolved problem with memory leaks caused by unsubscribed subscriptions.
2. New Features:
- Added new tree view component.
MDB Angular 8.7.0
Release date: 2019-11-25
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 8.7.0 we added some fixes and new features. Check what changed below:
If you want to upgrade from MDB 7 version, please read our migration guide:
MDB Angular Migration Guide1. Fixes
- Sidenav - resolved problem with closing sidenav when mobile keyboard appear on the screen,
- Datepicker - resolved problem with next and previous arrows styles on IE11,
- Select - resolved problem with search input and value container styles in outline mode,
- Select - added validation styles for bootstrap version,
- Autocomplete - resolved problem with dropdown dynamic position when
appendToBody
option is used, - Autocomplete - resolved problem with dynamic dropdown position updates on option filtering,
- Lightbox - resolved problems with browser navigation,
- Buttons - resolved problem with dynamic style updates for outline and flat button,
- Color picker plugin - resolved problem with rendering the plugin inside modal,
- Zip packages/Admin template - resolved problem with
ng test
andng lint
.
2. New Features:
- Table search - added possibility to search through multiple table columns,
- Reveal cards - added new
(animationStart)
and(animationEnd)
outputs, - Table pagination - added new
(lastPageClick)
and(firstPageClick)
outputs.
MDB Angular 8.6.0
Release date: 2019-11-12
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 8.6.0 we added some fixes and new features. Check what changed below:
If you want to upgrade from MDB 7 version, please read our migration guide:
MDB Angular Migration Guide1. Fixes
- Select - resolved problem with maintaing focus on component when navigating using keyboard and added proper colors for focused component,
- Select - resolved problem with navigation to other element using tab or shift+tab keys,
- Select - added different color for highlighted options to help to distinguish selected options from highlighted options,
- Select - resolved problem with highlighting option when typing its name (it works when filter input is disabled),
- Select - resolved problem with dropdown position when using filter input or custom content,
- Select - resolved problems with styles and dropdown position in outline mode,
- Select - resolved problems with resetting selected value,
- Buttons - styles will be now properly updated if inputs values change,
- Prefix icon - removed unecessary color transition delay,
- Datepicker - resolved problem with disabling component with reactive forms
- Datepicker - resolved problem with z-index in inline mode (this problem occured when multiple components were used in the same view),
- Table sort - resolved problem with returning undefined
sortOrder
in(sorted)
output.
2. New Features:
- Select - added possibility to use prefix icon,
- Select - added proper aria attributes,
- Timepicker - added possibility to mark input as readonly,
- WYSIWYG plugin - added new
(valueContent)
output that will return only text content without HTML tags.
MDB Angular 8.5.0
Release date: 2019-10-28
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 8.5.0 we added some fixes and new features. Check what changed below:
If you want to upgrade from MDB 7 version, please read our migration guide:
MDB Angular Migration Guide1. Fixes
- Datepicker - resolved problem with opening multiple datepickers on label click when
inline
mode is used, - Datepicker - resolved problem with styles of right and left arrows when date picker is rendered inside
mdb-stepper
, - Datepicker - resolved problem with z-index in inline mode (dropdown should no longer be overlapped by a footer),
- Multiselect - resolved problem with styles of checkboxes when select is used inside element with
md-form
class, - Select - resolved problem with setting default value when change is detected in option array,
- Select - component styles have been corrected to adapt its appearance to other MDB form elements,
- Autocomplete - number of visible options will no longer be set by default. It resolves problem with options styles when
mdb-options
have a non-standard height, - Wysiwyg Plugin - removed default value with MDB image and text.
2. New Features:
- Table sort - added new
(sorted)
output that emits data, sortDirection and sortBy parameters, - Autocomplete - added new
[dropdownHeight]
input that allows to customize dropdown height (it will only work ifvisibleOptions
input is not used).
3. Docs:
- Modal - added list of options available for dynamic modals
- MDB Angular Boilerplate - added guide on how to configure MDB Angular Pro version.
MDB Angular 8.4.0
Release date: 2019-10-14
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 8.4.0 we added some fixes and new features. Check what changed below:
If you want to upgrade from MDB 7 version, please read our migration guide:
MDB Angular Migration Guide1. Fixes
- Datepicker - resolved problem with opening multiple datepickers on label click. Every component will now have unique id. You can specify this id in
[id]
input, otherwise custom id will be created, - Chips - resolved problem with displaying default tags on component initialization,
- Chips - resolved problem with deleting items with backspace/delete key,
- Chips - resolved problem with input focus after adding first tag or removing last tag,
- Modal - resolved problem with modal position when backdrop option is set to
false
, - Autocompleter - resolved problem with closing dropdown on scroll click.
We needed to drop support for dropdown state updates on input blur event, because in many cases it was impossible to check whether dropdow should be closed. If you need to programatically change focus to other element withfocus()
method, you should also programatically hide autocompleter dropdown by using itshide()
method, - Autocompleter - removed unecessary border styles from
mdb-option
, - Autocomplter - resolved problem with opening dropdown when
[clearButton]
is set to false, - Dropdown - resolved problem with change detection, dropdown should be correctly removed from DOM even when OnPush strategy is used in parent component,
- Select - dropdown won't open on right click on input,
- Select - resolved problem with displaying long placeholder and label text,
- Select - resolved problem with opening dropdown on label click (this problem occured only when label was added as html element and not with
[label]
input), - Sortable plugin - resolved problem with blocked click events,
- Sortable plugin - resolved problem with width of cards in card deck example.
2. New Features:
- Select - added possibility to add object to the
value
parameter in select options array, - Select - added new
[compareWith]
input that accepts a function that will be used to find corresponding option for specified value (useful when using object as option value), - Calendar plugin - added new
(monthChanged)
,(weekChanged)
and(listChanged)
outputs, - Popover - added new
[bodyClass]
,[headerClass]
and[containerClass]
inputs that allow to specify custom classes.
MDB Angular 8.3.1
Release date: 2019-09-30
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 8.3.1 we added some fixes and updated code in the documentation pages. Check what changed below:
If you want to upgrade from MDB 7 version, please read our migration guide:
MDB Angular Migration Guide1. Fixes
- Checkbox - resolved problem with checked state updates on ngModel value change,
- Autocompleter - resolved problem with
Cannot read property 'value' of undefined
on up arrow navigation, - Dropdown - resolved problem with material styles in default version,
- Textarea - added possibility to resize material version,
- Timepicker - resolved problem with clear button, it should be now displayed correctly,
- Table pagination - resolved problem with pagination when switching to last item,
- Sidenav - resolved problem with accordion auto expand/collapse when
queryParams
are used.
MDB Angular 8.3.0
Release date: 2019-09-16
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 8.3.0 we added some fixes, new features and updated code in documentation pages. Check what changed below:
If you want to upgrade from MDB 7 version, please read our migration guide:
MDB Angular Migration Guide1. Fixes
- Admin Pro Template - resolved problem with responsivity,
- Flipping cards - resolved problem with animation,
- Time picker - resolved problem with change detection when setting default value,
- Time picker - component will now open on input focus, to disable this behavior set
openOnFocus
input tofalse
, - Checkbox - resolved problem with position of validation message for longer text,
- Radio buttons group - resolved problem with styles for rounded buttons,
- Breadcrumbs - added
cursor: pointer
style for inactive elements, - File upload - resolved problem with uploading the same file multiple times in a row,
- Sidenav - resolved problems with accordion items auto expand on route change,
- Sidenav - reduced size of indicator arrow in accordion items and fixed its animation,
- Modal - resolved problem with alignment of items in dynamic full height modal,
- Select - resolved problem with styles on disabled state,
- Toast - resolved problem with
maxOpened
option, - Carousel - resolved problem with displaying first slide when OnPush strategy is used in parent component,
- Accordion - resolved problem with
aria-expanded
value, - Select - resolved problem with
highlightColor
andhighlightTextColor
options, - Autocompleter - dropdown will no longer be closed on input click.
2. New Features
- Date picker - added possibility to add default date in JavaScript Date Object format. Component will also return date object if
useDateObject
option is set totrue
(default value isfalse
) - Dropdown - added new
dropupDefault
input that allow to use dropup component with default Bootstrap styles, - Autocompleter - added new
clear
method that allow to reset displayed value, - Table - added new
searchLocalDataByFields
method that allow to filter result only in specific table columns, - Autocompleter - added new
optionHeight
input that allow to set height for the dropdown options, - Autocompleter - added new
visibleOptions
input that allow to change number of options visible in the dropdown, - Autocompleter - added new
displayValue
input that allow to specify option value that will be displayed in the input text field. This is useful in cases where we want the value processed by the form control to be different from the displayed value (for example when value of the option is an object).
3. Docs
- Datatables - added example of master detail table
- Charts - added examples of data formatting
- Time picker- added validation example
MDB Angular 8.2.0
Release date: 2019-08-26
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 8.2.0 we resolved some problems with change detection and reduced number of unecessary change detection cycles caused by our components. These changes should positively affect the performance of applications that use MDB Angular.
If you want to upgrade from MDB 7 version, please read our migration guide:
MDB Angular Migration Guide1. Fixes
- Credit card directive - changed limit of Diners card from 19 to 14,
- Autocomplete - resolved problem with position of dropdown displayed above the completer input (it should now update correctly when number of displayed options change),
- Date picker - resolved problem with label animation when click is detected directly on label text,
- Date picker - resolved problem with display of default date when using locales other than 'en',
- Carousel - resolved problem with video playing in the background even when slide is not active,
- Select - resolved problem with long placeholder overlapping select input,
- Chips - items will be now added also on blur event,
- Toast - resolved problem with null check in
show
method, - Navbar - resolved problem with scroll in navbar dropdown when
.fixed-top
class is added, - Dropdown - resolved problem with fade out animation,
- File upload plugin - resolved problem with resetting default file,
- File upload plugin - resolved problem with 'No file chosen' message when default file is available.
2. New Features
- Autocomplete - added new
(selected)
output that is fired on selection change, - Accordion - added new
[autoExpand]
input that allow to disable auto expanding of accordion items in sidenav when active route is detected, - Table editor plugin - added sorting feature.
MDB Angular 8.1.1
Release date: 2019-08-05
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 8.1.1 we added some minor fixes and updated code in documentation pages. Check what changed below:
If you want to upgrade from MDB 7 version, please read our migration guide:
MDB Angular Migration Guide1. Fixes
- Lightbox - resolved problem with styles (hover, cursor, margin),
- Lightbox - resolved problems with back button in mobile browsers,
- Ligthbox/Carousel - resolved problem with paths to images,
- Autocompleter - resolved problem with dropdown position when its rendered on top, it should no longer cover the input
- Autocompleter - resolved problem with closing the dropdown with
hide()
method, - Fixed button - removed unnecessary
right
andleft
styles, - Select - removed
display: none
style from standard HTML select, - Inline date picker - resolved problem with closing dropdown when using multiple date picker in the same view, the dropdown should now close automatically when another date picker is opened
- Inline date picker - resolved problem with previous/next buttons styles,
- Credit card directive - resolved problem with formatting of the Diners card number,
- Rounded buttons - resolved problem with styles when using rounded buttons and mdb-calendar plugin in the same view,
- Range slider - resolved problem with value updates in reactive forms,
2. Docs
- Cards - updated code responsible for rendering image overlay,
- Progressbar - updated API section of the component,
MDB Angular 8.1.0
Release date: 2019-07-22
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In version 8.1.0 we added some new features and bug fixes. Check what changed below:
If you want to upgrade from MDB 7 version, please read our migration guide:
MDB Angular Migration Guide1. Fixes
- Dynamic modal - resolved problem with backdrop in lazy loaded modules (it should no longer remain on screen after navigating to a different module),
- Carousel - resolved problem with auto slide,
- Sticky header - resolved problem with
stickyHeader="true"
in Chrome browser, - Table search - resolved problem with filtering for nested data,
- Vertical list group (mdb-tabset) - resolved problem with display on hover in Safari browser,
- Time picker and Date picker - resolved problem with different input position in these form controls,
- Popover - resolved problem with
outsideClick
in Safari browser (ipad), - Accordion - resolved problem with alignment of indicator icon,
- Accordion - resolved problem with OnPush change detection,
- Register/login modal - resolved problem with alignment of
mdb-success
andmdb-error
messages, - Video modal - resolved problem with not pausing video when closing modal,
- Select - resolve problem with position of clear button,
- Double navigation - resolved problem with missing
margin-left
andmargin-right
in dobule navigation layouts, - Textarea - resolved problem with active state of the label (it should no longer have blue color when it's not focused),
- Fixed caption button - resolved problem with
element[NATIVE_ADD_LISTENER] is not a function
error.
2. New Features
- Table pagination - added new buttons for navigation to first and last page,
- Charts - added new
getPointDataAtEvent(event)
for getting cursor position after click.
3. Docs
- Migration guide - added information about cards and skins,
- Sidenav - added live preview for slim sidenav,
- Charts - added example on how to display values for each point of the graph,
- Forms - updated example code with new validation method,
- Validation - updated example code for onSubmit validation method,
- Dynamic modal - added example on how to use output events,
- Parallax - added additional information about the usage in Angular project.
MDB Angular 8.0.0
Release date: 2019-07-8
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
Most important changes in version 8.0.0:
- support for Angular 8 - new Angular version is now required in MDB Angular 8.0.0
- modular styles - components styles will be loaded with their modules, that means you can load only the styles you need in your application (some of the styles still remain global as they are not part of any component)
- some bug fixes and new features
We created a migration guide that contain information on how to prepare your Angular and MDB code and files for version 8.0.0. You can find it here:
MDB Angular Migration Guide1. Fixes
- Fluid modal - the modal will no longer overwrite
padding-right
styles on thebody
element, - Fixed button - resolved problem with
ExpressionChangedAfterItHasBeenCheckedError
error, - Dynamic modal - resolved problem with focus trap (other elements on the page should no longer be focusable if the modal is displayed),
- Autocompleter - resolved problem with
click
event on the clear button, - Autocompleter - resolved problem with blocked events in autocompleter dropdown (it should be possible to add events to mdb-option components and other custom elements that are displayed in completer dropdown),
- Stepper - removed automatic mode change from horizontal to vertical on smaller screens. The stepper mode will be changed only if
[vertical]
input value change - Dropdown - resolved problem with visibility of dropdown menu when it was opened from element with
mdbTooltip
directive.
2. New Features
- Steppers - added new
[stepChange]
output which will be fired on every step change, - Autocompleter - added Control Value Accessor to completer input (that should resolve problems with
valueChange
in reactive forms).
3. Docs
All code examples have been updated to work correctly in Angular 8 projects. Due to the changes in styles modularity, there may be slight differences when it comes to overwritting component styles.
We also reviewed the documentation and removed minor errors like typos and old, unused code.
- Autocompleter - changed the code of the examples to make it shorter and more readable
MDB Angular 7.5.4
Release date: 2019-06-10
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
New version brings some bug fixes and new features. Check every change in 7.5.4 below.
1. Fixes
- Select label with prefilled value 0 won't break lifting up label element,
- Select will now be properly aligned with other material inputs,
- Material Select will now close it's dropdown while clicking outside of it on iOS,
- visibleOptions in Material Select will now work again when select was opened for the first time,
- Carousel won't throw classList is undefined anymore,
- Datepicker won't throw document is undefined while SSR no more,
- Datepicker will now allow to use Font Awesome 5 Pro with css,
- Datepicker will now format date properly while using patchValue and JS date format,
- Toast with changed opacity won't blink anymore,
- Resolved problems with access specificators on fullTemplateTypeCheck mode,
- Color Picker won't throw erorrs when destroying it's instance,
- Sidenav with routerLink will now open active links after reload while using HashLocationStrategy.
2. New Features
- Material Select - Added new input -
[outline]
which will allow to use outline input type, - Multi Select - Added new input -
[outline]
which will allow to use outline input type, - Material Select - added ChangeDetectionStrategy.OnPush from default to the Material Select dropdown,
- Autocomplete - Added new output which will emit value after clicking in clear button,
- Table Editor plugin - added behavior to highlight table editor row when editing row,
- Table Pagination - added two new
ofKeyword
,dashKeyword
inputs which allow to overwrite default text in Table Pagination, - Accordion - added new
(animationStateChange)
event which will be fired after accordion animation end, - Cards - added ChangeDetectionStrategy.OnPush from default to the Cards components,
- Sortable plugin - added new
[disabledDragElements]="[]"
input which allow to determine, on which elements sortable effect should be disabled. - Chat plugin - added new chat example - Small Chat,
- E-commerce components - added new example - Shopping Cart.
3. Docs
- Navbars - resolved problem with dropdown alignment on mobile screen,
- Material Select - added missing inputs and outputs to the Material Select API docs.
4. Other
- Resolved vulnerability problems on four repositories: MDB Free, MDB Admin Free, MDB Pro, MDB Admin Pro.
MDB Angular 7.5.3
Release date: 2019-05-27
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
New version brings some bug fixes and new features. Check every change in 7.5.3 below.
1. Fixes
- Tooltip with
routerLink
and nestedi
tag won't reload page after click, - Improved positioning in Tooltip - use
dynamicPosition
input to turn off adjusting position, - Improved positioning in Popover - use
dynamicPosition
input to turn off adjusting position, - Accordion will now allow to use keyboard navigation (Tab, Enter, Space).
2. New Features
- Double Range Slider - Added new component - Two dots range slider,
- Accordion - changed icon behavior - now it is rendered with css and
content
property, - Flipping Cards - added
(animationStart)
and(animationEnd)
outputs, - File Upload plugin - added new
customText
input which allow to overwrite default text in File Upload, - File Upload Plugin - added new
[defaultFile]"
input which allow to set default file for File Input component, - Date Picker - added possibility to use
LocaleService
as global service - one instance for every instance of Date Picker, - Material Select - added feature which allow to highlight specific item after keyboard button push (eg. push "F", and Select will highlight item which starts on "F" char),
- Material Select - added new
[filterAutocomplete]="true"
input which allow to determine, Select should allow browser autocomplete mechanism or not, - Material Select - Select will now allow you to define custom template in it,
- Toast / Notification - added new
actionButtonClass
config property which allow to add CSS class to action button in toast, - Date Picker - added new
editableDateField
config property which allow to disable Date Picker input field to put there some text, - Popover - added new
[outsideClick]="true"
input which allow to determine, if Popover should be closed after clicking in it's content, - Date Picker - added new
[outlineInput]="true"
input which allow to use the.md-outline
class inside Date Picker, - Time Picker - added new
[outlineInput]="true"
input which allow to use the.md-outline
class inside Time Picker.
3. Docs
- Multi Item Carousel - added new Multi item responsive carousel,
- Flipping Cards - added information about this, that Flipping Cards requires
BrowserAnimationsModule
.
MDB Angular 7.5.2
Release date: 2019-05-13
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
New version brings some bug fixes and new features. Check every change in 7.5.2 below.
1. Fixes
- Table pagination - resolved problem with displayed value of
maxVisibleItems
, - Tooltip - resolved problems with alignment near the edge of viewport,
- Dropdown - resolved problem with menu position when its open near the edge of viewport,
- Autocompleter - resolved problem with dropdown position in Chrome,
- Select/multiselect - resolved problem with animation of label added with html tag,
- Date picker - resolved problem with dynamic value and format updates when locale input change,
- Date picker - resolved problem with disabling component in reactive forms,
- Validation - resolved problems with validation of default value in
mdb-select
component, - Sidenav - resolved problem with component blinking on initialization,
- WYSIWYG plugin - added
type="button"
to the options buttons to resolve problem with form submitting.
2. New Features
- Select / Multiselect - added possibility to customize toggle icon,
- Sidenav - added new slim sidenav version,
- Calendar plugin - added new
[editable]
input that allow to disable event editing, - Calendar plugin - added new
[options]
input that allow to add custom configuration options, options. - Date picker - changed design
3. Docs
- Modals - updated example code for long content modals
- Date picker - added new examples for setting default value,
- Datatables - added new example for passing table data to dynamic modal,
- Calendar plugin - added new instructions on how to use custom configuration options,
MDB Angular 7.5.1
Release date: 2019-04-29
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
New version brings some bug fixes and new features. Check every change in 7.5.1 below.
1. Fixes
- Sticky Header - resolved problem with 'BrowserModule has already been loaded',
- Toast - resolved problem with animation in Edge,
- Carousel - resolved problem with 'Cannot read property classList of undefined',
- Card reveal - resolved problems with animation,
- WYSIWYG plugin - resolve problems with value dynamic updates and valueChange event.
2. New Features
- Fixed buttons - added new
mdbFixedCaption
directive that allow to add caption to button, - Navbar - added new
[scrollSensitivity]
input that allow to specify scroll amount needed for thetop-nav-collapse
class to be added, - Stepper - added new
[editable]
input that allow to disable edition of finished step, - Sidenav - added new
[side]
input that allow to change position of the sidenav. Use[side]="'right'"
or[side]="'left'"
options, - Inputs - added new Material 2.0 input with background and animated border.
3. Docs
- Card reveal - added live example,
- Composition - added example with hidden sidenav under fixed navbar.
MDB Angular 7.5.0
Release date: 2019-04-15
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
New version brings breaking changes in tables, some bug fixes and new features. Check every change in 7.5.0 below!
1. Breaking changes in tables
MdbTableService
will be no longer used and it will be removed from package in MDB Angular 8 version. All methods available in this service were moved to the MdbTableDirective
.
New [tableEl]
input was added to MdbTablePaginationComponent
. This input accepts instance of MdbTableDirective
, and it's required for the pagination to function properly.
toLowerCase()
method was removed from MdbTableSort
directive due to problems with sorting in Chrome browser. Sort headers values must be now exactly the same as values of data source objects properties.
All changes have been included in the new examples in the tables documentation.
2. Fixes
- Frame Modal - resolved problem with displaying in Safari browser,
- Fluid Modal - resolved problem with position on smaller screens,
- Autocompleter - resolved problem with dropdown position in modal,
- Autocompleter - resolved problem with form submitting when using enter key to select an option,
- Collapse - resolved problem with displaying shadow of card component,
- Horizontal Stepper - resolved problem with dynamic height update,
- Accordion - resolved problem with asynchronous data,
- Accordion - resolved problem with multiple accordion instances inside one component,
- Table sort header - resolved problem with accessibility,
- Navbar - resolved problem with accessibility of navbar toggler button.
3. New Features
- Date picker - added new inline version,
- Date picker - added javascript date to object emitted by
(dateChanged)
output, - Date picker - added new
(closeButtonClicked)
,(todayButtonClicked)
and(clearButtonClicked)
outputs, - Table sort - added new
(sortEnd)
output that will emit sorted data, - Sticky header - added new
mdbStickyHeader
directive that can be added tomdb-navbar
component to hide navbar when scrolling down and bring it back when scrolling up. - WYSIWYG plugin - added ControlValueAccessor implementation.
4. Docs
- Inputs - added new fix for yellow or blue background that is added with Chrome auto-fill,
- File upload plugin - changed component type from FileUploadComponent to MdbFileUploadComponent,
- Table sort - added TitleCase pipe to sort headers,
- Table pagination -
onPreviousPageClick
andonNextPageClick
methods were moved to theMdbTablePaginationComponent
internal code.
MDB Angular 7.4.4
Release date: 2019-04-01
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
New version brings some bug fixes and new features. Check every change in 7.4.4 below!
1. Fixes
- Multiselect - disabled options will be now skipped correctly in 'Select all' method,
- Table pagination - resolved problem with accessibility,
- Table filter - resolved problem with searching in list with null values,
- Table filter - search will now work correctly for uppercase letters,
- Table sort - resolved problem with sorting null values,
- Autocompleter - resolved problem with scrollbar,
- Autocompleter - resolved problem with z-index in modal,
- Textarea - resolved problem with
rows
attribute.
2. New Features
- Time picker - added new
(timeChanged)
output that will be emitted on time change, - WYSIWYG plugin - added new
(valueChanged)
output which emits current value as string.
3. Docs
- Skins - added new instructions on how to add new data to skin.
MDB Angular 7.4.3
Release date: 2019-03-18
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
New version brings a lot of bug fixes, and improved performance in Material Select Component. Check the every change in 7.4.3 below!
MDB Angular Application Boilerplate
Tired of configuring each new application in the same way? Check out our free starter boilerplate for the Angular app. Here you will find NGRX, Firebase, Login and Registration!
1. Fixes
- Select - resolved problem with performance,
- Select - resolved problem with option height on dynamic option update,
- Multiselect with filter - resolved problem with options position,
- Dynamic modal - resolved problem with animation when mdb-select component is added to modal template,
- Datepicker - resolved problem with event emitting on input focus and added new
[openOnFocus]
input. Add[openOnFocus]="false"
to prevent date picker from opening on input focus, - Checkbox -
(change)
event won't be emitted beforevalueChanges
on Edge anymore, - Lightbox - magnifier icon will zoom picture properly,
- Dynamic Modal - animation on Edge will now won't blink,
- Dynamic Modal with Select - the animation won't blink on Edge anymore,
- Modals - resolved problem with focusing element from background while modal was opened,
- Auto Completer - resolved problem with scrolling down completer's dropdown with keyboard on Chrome,
- Auto Completer - fixed problem with wrong highlighted item after first click on arrow down key,
- Inputs with icon prefix - icon will now be highlighted after input focus,
- Carousel with Crossfade - rewritten the crossfade animation so it now looks like this one from MDB jQuery.
2. New Features
- Auto Completer - added functionality to pick highlighted (with keyboard) item as input's value,
- Auto Completer - added
(select)
output event which is fired after item selection, - Icon - added
classInside
input which allow to add class to inside element ofmdb-icon
element, - Badge - added
classInside
input which allow to add class to inside element ofmdb-badge
element, - Navbars - added
possibility to add custom element to
mdb-navbar
template (it will allow to add custom back button to iOS devices), - Table Sort - added functionality to sort over nested object properties.
3. Docs
- File Input - added example of upload options usage,
- File Input - added few new examples how to use options,
- Date Picker - added new [openOnFocus] input to input list,
- Carousel - updated input list in API section,
- Auto Completer - added example how to send API calls after
(input)
event, - Charts - added Stacked Bar Chart example,
- Checkbox - Added Template-Driven forms example,
- Checkbox - Added Reactive Forms example,
- Table with Pagination - Modified Basic Example code,
- Table Editable - Modified Basic Example code (now it has bigger padding on table items),
- Plugins - Added Live Preview in MDB Angular Demo App,
- Navbar - Added 4 new navbar examples to the Basic Example section,
- Dropdowns - Added new example how to open dropdown from various elements,
- Sticky Content - renamed
sticky-after
input tostickyAfter
. Previous code is still compatible, - Steppers - Added new example how to add icons to the each steps with SCSS,
- Toast with opacity -Customized the opacity scss code,
- Sidenav - Added new example how to build sidenav with nested accordion links,
- DataTables - Customized the
searchItems()
function in every DataTables example.
4. Changes
- Auto Completer - changed
behavior of
textNoResults
input. From now, you have to set it to be visible. From default, this text is not visible.
MDB Angular 7.4.2
Release date: 2019-03-04
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In this version we resolved few bugs and resolved the problem with mdb-angular-free zip install on Windows. Check the 7.4.2 changes below.
1. Fixes
- Collapse animation will now work properly on MacOS and Safari Browser,
- Lightbox won't throw the
this.galleryDescription is undefined
no more, - Resolved problem with
search.toLowerCase() is undefined
in Table Search, - mdbWavesEffect won't hide button text no more while button is nested in Accordion on Chrome 71 & 72.
2. New Features
- Table Sort - added custom trim function which allows to sort table data while table data contains white signs,
MDB Angular 7.4.1
Release date: 2019-02-18
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In this version we resolved problems with a lot of bugs. Check the 7.4.1 changes below.
1. Fixes
- mdb-auto-completer component won't throw errors when navigating with keyboard while dropdown is closed,
- mdbAutoCompleter - resolved problem with rendering completer's dropdown below the parent with
overflow: hidden style
- necessary to use the[appendToBody]="true"
input, - mdbAutoCompleter will now render along the top edge of the input when it won't fit below the input,
- mdbAutoCompleter - resolved problem with showing clear button in the first
mdb-auto-completer
while there were two or more of them, - mdb-image-card - image card will now properly scale when his container is
.col-6
or more, - mdb-card - from now it's possible to overwrite the default shadow with one of
.z-depth-*
class, - mdbInputDirective - renamed the
mdbValidate
input to themdbValidation
due to duplicated name conflict, - mdbInput - from now, it's possible to bind dynamic value to the input placeholder via
placeholder="{{text}}"
string interpolation, - mdbCheckboxChange - will now be exported, so problem with unable to import this class from the
ng-uikit-pro-standard
will gone, - Sidenav & Nested Accordion - from now only the active
mdb-accordion-item
element will be highlighted, - Navbar - added possibility to use the
hide()
method to collapse navbar after click on mobile view, - Select - added mechanism to prevent line wrap in
mdb-select
item when it is wider than select dropdown, - Lightbox - image size will now be little bit larger,
- Toast - the positioning classes
.md-toast-top-center .md-toast-bottom-center
will now work as they should, - Checkbox - resolved problem with validation while using
onSubmit
oronBlur
properties, - Textarea validation - validation message won't be overlapped with bottom border of the element on Firefox,
- Accordion - resolved problem with not working
[multiple]="false"
onmdb-accordion
generated with*ngFor
loop, - Thumbnail Carousel - thumbnails will now be properly highlighted while active.
2. New Features
- Inputs - new Material 2.0 inputs (outlined),
- Added new helper classes for opacity: Incremented by 10,
.opacity-0
,.opacity-10
until 100. - mdbAutoCompleter - added new
[appendToBody]="true"
input which will determine if completer's dropdown should be appended to the body element or it's parent. Useful while completer's parent gotoverflow: hidden
style. - Date Picker - added new
closeBtnClicked()
method which allow to hide Date Picker programmatically.
3. Documentation
- Masonry - Added documentation for Masonry Layout,
- Autocompleter - added
example how to use
[appendToBody]="true"
input, - Date Picker - added example how to show / hide date picker with typescript method,
- Vertical Tabs
- added new necessary class
.list-group
for the Vertical Tabs in list group, - Notifications - changed the iconClasses in API section,
- Notifications - resolved problem with not working alerts,
- Pattern Validation - updated the allow only letters regex pattern,
- Navbar - corrected the method names,
- Multi-Item carousel gallery - added new most recent code.
MDB Angular 7.4.0
Release date: 2019-02-04
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In this version we resolved problems with our modules and tree shaking. It is now possible to import only those modules you need in your application, which will significantly reduce bundle size. We also updated Bootstrap to the newest version (4.2.1).
1. Bootstrap version update
- Added new spinner loading component,
- Added new
.font-weight-lighter
and.font-weight-bolder
utitlities, - Added new
.text-decoration-none
class, - Added new negative margin utility classes (e.g,
.mb-n3
), - Changed auto columns (e.g,
.col-auto
) frommax-width: none
tomax-width: 100%
to prevent content from causing a column to overflow the parent, - Added
md
prefix to scss code of our alert components to avoid overwritting bootstrap classes.
2. Fixes
- Popover / Tooltip - resolved problems with displaying in Firefox/Safari browsers on Mac OS,
- Multiselect - changed some methods to provide better support for older browsers,
- Carousel - resolved problem with OnPush change detection,
- Validation - resolved problem with positioning messages under inputs with icons,
- Select with filter - resolved problem with ExpressionChangedAfterItHasBeenCheckedError,
- Select with icons - resolved problem with padding,
- Steppers - updated styles to resolve problem with Font Awesome 5 Pro icons,
- Tooltip - resolved problem with placement.
3. Documentation
- Multi item carousel - updated example code. From now only one item should be displayed on smaller screens,
- Switch - changed syntax of default component,
- Borders - added new
border-white
androunded-pill
examples, - Overflow - new documentation page in utilities section,
- Icons list - updated example code of the icons,
- Table editable - changed example code to resolve problems with editing on Edge 15.
4. New Features
- Select - added new
[optionHeight]
input which allow to customize options height, - Select - you can now use
[appendToBody]="true"
input to avoid problems with displaying select dropdown in container withoverflow: hidden
, - Multiselect - added new
selectAllLabel
input which allow to customize text of 'Select all' option, - Tabs - added possibility to add action buttons to tabset header.
MDB Angular 7.3.0
Release date: 2019-01-21
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In this release we have migrated our entire library to Font Awesome 5. Changing from 4 to 5 is not backward compatible, so we recommend updating the application to Font Awesome 5.
1. Fixes
- Datepicker - Solved problems with date formatting, when the component is in *ngIf,
- Tabs - It is no longer necessary to double-click to activate the tab during OnPush,
- Tabs - Disabled tab will not be marked as active,
- Sidenav & Custom Skin - Solved problem with text color overwriting in Sidenav in combination with custom skin,
- Select & Custom Skin - Solved problem with overwriting text color in Select with Custom Skin,
- Table Sort - Sorting tables will not display an error .toLowerCase() is undefined,
- Tooltips & Admin Template Pro - Fixed tooltips in Admin Template Pro,
- API - Removed deprecated API -
HttpModule
,eflectiveInjector
,NavigationExtras.preserveQueryParams
, - Lightbox & Firebase - Solved problem with Lightbox and Firebase,
- Navbar - Navbar in mobile version will not flash on the screen,
- Textarea - Autoresizing Textarea will expand when text is added before rendering a view,
- Auto Completer - Resolved problem with .trim() is undefined in mdb-option component,
- Auto Completer - Resolved problem with appendChild is undefined in mdb-auto-completer.directive.
2. Documentation
- Checkbox - Added documentation for Template Driven & Reactive Forms Checkbox,
- PWA Tutorial - Published new version of Angular PWA tutorial with Firebase and IndexedDB!
3. New Features
- Font Awesome 5 Icons - compatibility with Font Awesome 5,
- Admin Template Pro - Added Sections page to Admin Template Pro,
- Steppers - added new Steppers component,
- Dynamic Modals - Added a new way to pass data to dynamic modals,
- Scrollspy - Added event
activeLinkChange
to Scrollspy.
MDB Angular 7.2.0
Release date: 2019-01-07
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
In this release we added new mdb-auto-completer component, which is improved version of mdb-autocomplete.
We encourage you to use mdb-auto-completer, but mdb-autocomplete will still be available until version 8 of MDB Angular.
1. Fixes
- Select - resolved problems with updating values dynamically,
- Dropdown - resolved problem with content position when opened in navbar,
- Modal - removed unnecessary icon styles,
- Autocomplete - resolved problem with
@angular/http
2. Documentation
- Table with panel - resolved problem with icon names,
- Navbars - removed unnecessary margin from search element,
- Validation - added example for file upload validation.
MDB Angular 7.1.1
Release date: 2018-12-18
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
1. Fixes
- Select - resolved problems with OnPush change detection,
- Select - changed styles and animation to add more material look,
- Multiselect - resolved problem with disabled option styles,
- Date Picker - resolved problem with dynamic value updating,
- Date Picker - resolved problem with opening using built-in method,
- Table Pagination - resolved two minor problems.
2. New features:
- Dynamic Modal - added new
scroll
property to modal options object. It can be used to addoverflow-y: auto
to modal with long content, - Multiselect - added select all option. This option is enabled by default and can be turned off with
[enableSelectAll]="false"
input, - Multiselect - added button for clearing selected options,
- Select and Multiselect - added new
[highlightFirst]
input which can be used to turn off highlight added by default to the first option.
3. Documentation
- Scrollspy - added new example for MDB scrollspy on full page,
- Accordion - added new example,
- File Input - added new example,
- Select - updated code in examples,
- Multiselect - updated code in examples,
- Added description how to change default Roboto font,
- Intro Sections - resolved few minor problems,
- Accordion - added toggle() method description.
MDB Angular 7.1.0
Release date: 2018-12-10
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
We have rewritten the entire validation of forms. New validation is faster, lighter, better! Read about it below.
The mdbInputDirective
directive has been divided into mdbInput
and
mdbValidate
directives. Validation messages can ben now added with mdb-error
and
mdb-success
components. More information on the usage can be found in validation documentation.
New validation offers more flexibility and solves problems with updateOn: 'blur' and updateOn: 'submit' options.
Those changes are backwards compatible. Directive mdbInputDirective will be still available for next few versions, but we recommend to use the new directives.
1. Fixes
- Data Tables - pagination and search will now work without problems against data coming from Remote API,
- Carousel with thumbnails - The problem with a larger thumbnails strip width than the slide photo in case of more slides has been solved,
- Material Select - Filtering results with filterEnabled will now returns each line that contains the search character,
- Date Picker - Significantly improved component performance. Solved an issue where Date Picker was rendered before it was needed,
- Tooltip - A tooltip that does not fit in a free space along the top edge of the screen will be placed along the bottom edge, and vice versa,
- Tooltip - Added input
customHeight
which supports the above effect, but in case the height of the tooltip has been changed, - Tabs - The problem in which static tabs were rendered before those with *ngIf was solved. It is required to
use a new input
tabOrder
. Read more about this here, - Scroll Spy - Fixed problem with handling nested links,
- Modals - Solved problem with built-in modal service. Now it is possible to call modals from this service.
2. Documentation
- Data Tables - added new example how to use Data Tables with data from remote API,
- Tabs - added new example how to use both static & dynamic tabs,
- Tabs - added new
tabOrder
input, - Tooltips - added new example how to modify the Tooltip height,
- Tooltips - added new
customHeight
input, - Modals - added examples how to use built-in modal's service.
MDB Angular 7.0.0
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
Angular 7 version is now supported in MDB Angular
1. Fixes
- Date picker - resolved problem with disabled state added in reactive forms
- Date picker - resolved problem with typing the date in the input field
- Date picker - changed z-index styles to fix the problem that caused other elements to overlap the component
- Time picker - changed z-index styles to fix the problem that caused other elements to overlap the component
- Accordion - resolved problem with 'Cannot read property expandAnimationState of undefined'
- MdbInputDirective - resolved problem with displaying error and success messages when errorMessage and successMessage inputs values are empty strings.
- File Upload - resolved problem with 'Cannot read property unsubscribe of undefined'
2. New features
- Date picker - added new
[tabIndex]
input that allow to set tabindex of the date picker input field - Time picker - added new
[tabIndex]
input that allow to set tabindex of the time picker input field - Tabs - added new
[disableWaves]
input that allow to disable waves effect on the tabs buttons
MDB Angular 6.3.0
What's new?
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
The key "defaultProject" has been added to angular.json files of all packages containing the demo application. Thanks to that you can restart the application using the ng serve command.
In this update, support for the ng add function has been added to the MDB Angular Free product in the npmjs repository - angular-bootstrap-md. Thanks to that it is possible to install MDB Angular Free with one command ng add angular-bootstrap-md.
We have changed the structure of the .zip ng-uikit-pro-standard. In package.json file there is dependency ng-uikit-pro-standard indicating the file for local installation. If you want to install our MDB Angular Pro from GitLab servers, replace this path with a key starting with "//", which you will find in the same file (remember to replace text REPLACE_WITH_YOUR_TOKEN with your own personal token).
1. Fixes
- Select - resolved problem with placeholder when value is null
- Select - resolved problems with label styling. For the label to work correctly, we encourage you to add it
via
[label]
input instead of HTML<label>
tag. - Select - resolved problem with opening dropdown inside
mdb-collapse
component - Multiselect - added new styles to resolve problem with broken layout when many options are selected
- Autocomplete - resolved problem with label position on input blur
- Date Picker - resolved problems with component performance
- Cards - resolved problem with adding shadow classes
- Card Reveal - resolved problem with card height
- Resolved problems with dependency vulnerabilities in MDB Free and MDB Pro
2. New features
- Added possibility to create vertical tabs and vertical pills
- Added clear button functionality to
mdb-time-picker
3. Documentation
- File input - added instructions on how to upload file to server
- Sidenav - added instructions on how to use RouterLinkActive on mdb-side-nav links
4. Improved documentation
Added a new documentation format for all pages in following sections:
- Layout
- Utilities
- Content
- CSS
- Components
- Forms
5. Syntax change
Changed syntax in the following components:
- Timeline - added one new class .timeline-basic and added .timeline class to each version of timeline
MDB Angular 6.2.6
What's new?
See the details below. All the changes are backward compatible.
You can download the new version of MDB Angular Free on our website and MDB Pro from your account page.
1. Fixes
- Resolved problem with
ngIf directive
used onmdb-tab
- Resolved problem with active on disabled
mdb-tab
- Resolved problem with display of slider range cloud in Safari browser
- Resolved problem with usage of
routerLinkActive
inmdb-sidenav
. Sidenav should now highlight active item and toggle accordion item depending on the active route. - Resolved problem with display of mega menu when it is used together with
mdb-sidenav
component - Resolved problem with
mdb-sidenav
mask - Resolved problem with 'Attempt to use a destroyed view' in scroll-spy
- Resolved problem with 'ExpressionChangedAfterItHasBeenCheckedError' in
mdb-select
filter input - Removed unnecessary padding from
mdb-select
component
2. New features
- Added possibility to use icons
in option list of
mdb-autocomplete
component - Added focus animation to
mdb-autocomplete
clear button and new[clearButtonTabIndex]
input which allow to change tabindex attribute of this button
3. Documentation
- Date picker - updated options object in example code
- Tabs - added new instructions on how to set active tab programatically
- Gradients - added examples for additional gradients
- Skins - added instructions on how to add custom skin
- Select - resolved problems with overlapped label with select element
- Timeline - scss code is now in MDB Angular Pro package
- FAQ - removed old and unnecessary questions and added new one
4. Syntax changes
Following outputs names has been changed:
Modal:
(onShow)
is now(open)
(onShown)
is now(opened)
(onHide)
is now(close)
(onHidden)
is now(closed)
Dropdown:
(onShown)
is now(shown)
(onHidden)
is now(hidden)
Popover:
(onShown)
is now(shown)
(onHidden)
is now(hidden)
Tooltip:
(onShown)
is now(shown)
(onHidden)
is now(hidden)
These syntax changes are backward compatible, which means that your project will work with both the old and the new syntax.
We recommend that you update the syntax as soon as possible. The changes will be backward compatible for several more versions.
MDB Angular 6.2.5
What's new?
See the details below. All the changes are backward compatible.
You can download the new version of MDB Angular Free on our website and for MDB Pro from your account page.
Added two demo applications to ready-to-use archives containing MDB Angular Free and MDB Angular Pro, and to the Angular Bootstrap with Material Design repository on Github.
1. Fixes
- Resolved problem with
mdb-select
animation. Option list will appear above the component if there is not enough space below - Fixed bug which caused problems with opening
mdb-select
dropdown - Resolved problem with
mdb-autocomplete
events (keyup, keydown) which were emitted twice on each entry in the input element - Resolved problem with
mdb-side-nav
on Firefox - Resolved problem with hidden and fixed double navigation on IE11
- Resolved problem with double navbar in Admin Dashboard Pro
2. New features
- Added new directives which can be used to format credit card number, cvv number and date automatically
- Tables - added new TableModule containing
following elements:
MdbTableDirective
- responsible for different table types, for example: striped, responsive, hover, bordered, borderlessMdbTableRowDirective
- can be used to emit events after creating/removing table rowMdbTableScrollDirective
- responsible for table scroll along the x/y axisMdbTableSortDirective
- responsible for sorting items in the tableMdbTablePagination
- component responsible for table paginationMdbTableService
- service responsible for creating new rows, table search and table data source - Time picker - added
[disabled]
> input which allow to specify disabled state for the component input - Select - added new
visibleOptions
andtabindex
inputs. Those inputs can be used to change number of options visible in the options list and tabindex of the component - Added new BadgeModule module containing the MDBBadgeComponent
3. Documentation
- Editable table - resolved problem with moving cursor in edit mode
- Maps - added new example how to use Info Window in Google Maps
4. Syntax changes
-
Color - replaced
.default-text
,.primary-text
,.secondary-text
,.success-text
,.danger-text
,.warning-text
,.info-text
classes with Bootstrap ones:.text-default
,.text-primary
,.text-secondary
,.text-success
,.text-danger
,.text-warning
,.text-info
5. Deprecated
These settings will be stored only by one version yet:
-
.default-text
,.primary-text
,.secondary-text
,.success-text
,.danger-text
,.warning-text
,.info-text
classes
We removed these classes from the package:
.full-bg-img
.full-height
.side-nav .double-navbar .bc-min
.no-padding
.ql-modal, .product-panel
.no-radius
.section-blog-fw
.personal-sm
.classic-tabs (previous syntax not classic tabs at all)
.naked-card
.pricing-card .heading .card-overlay
MDB Angular 6.2.4
What's new?
See the details below. All the changes are backward compatible.
You can download the new version of MDB Angular Free on our website and for MDB Pro from your account page.
1. Fixes
- Resolved problem with event
(noOptionsFound)
inmdb-select
. It should no longer be emitted on every input in the select filter - Resolved problem with display of vertical images in
lightbox component
- Resolved problem with
mdb-collapse
default collapsed state.
2. New features
- Added new scrollspy component
3. Changed syntax
- Collapse - you no longer need to use
[mdbCollapse]="isCollapsed"
syntax, instead just addmdbCollapse
directive to the element and use[isCollapsed]="false"
input if you want collapsible element to be open by default.
4. New documentation
- Contact Form
- Breadcrumbs
- Table scroll
- Css demonstration page
- Gradient
- Background image
- Components demonstration page
- Button group
- Loader
- Sections demonstration page
- Advanced demonstration page
- Chat
- Timeline
- Edge Header
- Streak
- Video
- Notifications
- E-commerce components
- Gallery
5. Tutorials
MDB Angular 6.2.3
What's new?
See the details below. All the changes are backward compatible.
You can download the new version of MDB Angular Free on our website and for MDB Pro from your account page.
1. Fixes
- Resolved problem with unemitted
tooltipChange
event in Tooltips - Resolved problem with select component with
updateOn: 'blur'
option - Resolved problem with display of select clear button when input
[allowClear]
is set totrue
- Resolved problem with fixed buttons where one button overlapped another. Use of many fixed buttons in the same view should be now possible
- Resolved problem with label in date picker. It should no longer overlap on the displayed date
- Fixed problem with overlapped label in Autocomplete when there was some value after view init,
- Sidenav will now remove
.fixed-sn
or.hidden-sn
class from body element in ngOnDestroy lifecycle, - Fixed problem with wrong margin in input validation message in Cascading Modal form,
- Resolved problem with autoresizing textarea without
.md-textarea-auto
class - Resolved problem with visibility of content placed below header in intro sections,
- Resolved problem with dynamic updates of big data in date-picker component,
- Removed unnecessary console.log from Tabs Component,
.dropdown-menu-right
class will now align dropdown menu to the right side,- Modal without backdrop will now allow to interact with elements on the background.
2. Docs
- Added legacy docs for version 6.2.1
- Dropdown alignment section - updated example code responsible for menu position,
-
Advanced modals - updated example code
for modal advanced examples. Modal cookies, modal coupon, modal discount, modal related content and modal
abandoned cart should no longer block interaction with other elements. In order to achieve this behaviour you
need to add
modal-scrolling
class to the div withmdbModal
directive. - Modals - added new section with instructions on how to open a modal from another component,
- Intros - updated example codes to resolve problem with visibility of content placed below header,
- Tabs & pills - improved documentation
- Slider - improved documentation
- Switch - improved documentation
- Social Buttons - added examples how to get page share and like counters from Facebook API, and how to share a page on Facebook
- Autocomplete - added example how to
use
[textSearching]
input - Datepicker - Added methods, inputs and outputs description
- Megamenu - changed first and third megamenu code
- Navs - changed
.nav-tabs
class to.md-tabs
.
3. New documentation
4. Changed syntax
6.2.2
Changes in ZIP:
The structure of the .zip package containing the MDB Angular Free project has changed. In the new version, instead of providing the source code as a .tgz archive, MDB is installed as dependency from the npm repository. The way of using the package does not change - just download the .zip archive, unpack it, and execute command npm install.
The structure of the zip package containing the MDB Angular Pro project has changed. In the new version, instead of sharing the source code as a .tgz archive, MDB is installed as dependency from the GitLab server. The way you use the new version of the package has changed slightly. To install a new version from the .zip package, download it, unpack it, open the package.json file and add your token instead of REPLACE_WITH_YOUR_TOKEN, then execute npm install command.
The old and new versions of the .zip pro will be available next month. After a month, only the new version of the package will be available.
Fixes:- Resolved problem with select filter. It should now display only values that match the word you type,
- Resolved problem with select values and options that were updated dynamically. It should now work correctly both in template-driven and reactive forms,
- Resolved problem with dateFormat and startDate options in DatePicker component. It is now possible to set default start date which will be formatted as it was specified in format option,
- Resolved problem with auto resize textarea height,
- Resolved problem with errorMessage and successMessage inputs - it is now possible to update messages dynamically,
- Resolved file input problem with file upload,
- Resolved problem with gesture support for lightbox,
- Resolved problem with protected parameters in carousel component,
- Resolved problem with 'mdb-card is not a known element',
- Fixed problem with invisible arrow in Tooltip Component.
New features:
- Added possibility to disable accordion item. To do that, add
[isDisabled]="true"
input to<mdb-accordion-item-head>
, - Added new checkbox component.
Docs:
- Updated live examples in pagination advanced examples section,
- Updated file input example code,
- Updated code in carousel examples (there was a problem with display of carousel with mask),
- Updated checkbox docs,
- Updated accordion docs with examples of nested and disabled accordion,
- Added legacy docs for versions 6.0.0 and 6.1.0,
- Added update instructions for MDB Admin Templates (free and pro).
6.2.1
Fixes:
- Resolved problem when validation status was visible even when input was disabled,
- Resolved problem with select focus event (clicking the space bar when the component is selected with tab key is no longer required),
- Resolved problem with display of date-picker opened in the modal.
New features:
- Added possibility to choose custom color in mdb-spinner,
- Added new functionality to use only desired validation status (disabling success or error validation) by using [ validationSuccess ] ="true" or [ validationError ] = "true".
- Added new [ errorMessage ] and [ successMessage ] inputs that allow to pass string or variable with custom validation message (only works when data-error and data-success are not available),
- Added mdbBtn directive to handle button styling,
- Added new mdb-card, mdb-card-body, mdb-card-img, mdb-card-header, mdb-card-footer, mdb-card-text, mdb-card-title components,
- Added 'actionButton' option to alerts.
Docs:
- Fixed bug with wrong validation status in Success and Error messages section in Inputs docs,
- Added new section 'Navigation',
- Added new page 'Mega menu',
- Added new page 'Navs',
- Added new page 'Hamburger menu',
- Added new 'actionButton' option and new section 'Events' to Alerts docs,
- Added description and examples for new inputs ([ errorMessage ] , [ successMessage ], [ validationSuccess ] , [ validationError ] ) in Inputs docs,
- Removed duplicated elements from Autocomplete docs,
- Updated Autocomplete docs with example of 'textNoResults'; usage,
- Updated pagination advanced examples (added variables that allow to change the number of elements displayed on a given page).
6.2.0
MDB Angular Admin Templates:
- Resolved problem with not working hamburger menu in Admin Dashboard Free,
- Fixed problems with cards styling in Admin Dashboard Pro.
Fixes:
- Fixed a problem with the inability to update the charts labels together with the data,
- Resolved problem with only 1 image in Lightbox Component,
- Fixed problem with undefined calls after (ngModelChange) in Material Select component,
- Collapse directive won't throw undefined calls after emitting events,
- Datepicker date changed from string to javascript Date object,
- Fixed problem with unable to listen date changes in Datepicker Component,
- Resolved problem with fixed button sliding out from the bottom edge of the screen when it was at the top of the screen,
- Fixed simple warnings from ng lint,
- Fixed problem with innability to update labels and data in Chart at one time.
Docs:
- Described how to close Fixed Button content after click on some of his childs,
- Improved documentation of adding translation into Datepicker Component,
- Rewrote whole Modals Documentation section,
- Described how to open collapse after view init,
- Integration with ASP.NET Core moved from 5min-quickstart page to separate ASP.NET page,
- On Multiselect page added description how to add initial value to it and how to get value changes,
- Described how to update charts appearance dynamically.
Syntax changes:
- In Carousels,
<mdb-slide></mdb-slide>
is now<mdb-carousel-item></mdb-carousel-item>
, - Dropdown directive
dropdown
is nowmdbDropdown
, - Dropdown directive
dropdownToggle
is nowmdbDropdownToggle
, - In Popovers,
popoverTitle
is nowmdbPopoverHeader
, - In Flipping Cards,
<mdb-card-rotating></mdb-card-rotating>
is now<mdb-flipping-card></mdb-flipping-card>
, - In Sidenav,
<mdb-sidenav></mdb-sidenav>
is now<mdb-side-nav></mdb-side-nav>
, - In Accordion,
<mdb-squeezebox></mdb-squeezebox>
is now<mdb-accordion></mdb-accordion>
, - In Accordion,
<mdb-item></mdb-item>
is now<mdb-accordion-item></mdb-accordion-item>
, - In Accordion,
<mdb-item-head></mdb-item-head>
is now<mdb-accordion-item-head></mdb-accordion-item-head>
, - In Accordion,
<mdb-item-body></mdb-item-body>
is now<mdb-accordion-item-body></mdb-accordion-item-body>
, - In Autocomplete,
<mdb-completer></mdb-completer>
is now<mdb-autocomplete></mdb-autocomplete>
,
These syntax changes are backward compatible, which means that your project will work with both the old and the new syntax. We recommend that you update the syntax as soon as possible. The changes will be backward compatible for several more versions.
6.1.6
Fixes:
- Hotfix for input validation,
6.1.5
New Features:
- Added .md-textarea-auto class which allows textarea to auto resize when would not fit into it. This feature requires mdbInputDirective on textarea,
- Added functionality to set first active slide in Carousel.
Docs:
- Described Card Reveal Component: https://mdbootstrap.com/plugins/angular/flipping-cards/,
- Described changing opacity of alerts using toastClass option: https://mdbootstrap.com/docs/b4/angular/components/alerts/
Fixes:
- Solved problem in which backdrop in sidenav did not hide after scrolling the page on the mobile,
- Fixed problem with rotating Time Picker arrow on mobile,
- Fixed problem with (activeSlideChange) event in Carousel Component,
- Solved problem with resetting state of validation in forms,
- Fixed problem with scaling mdb-simple-chart, and centering text in chart.
Changed syntax:
Deprecated - these settings will be stored only by one version yet:
-
.personal-sm
class, -
.comments-list
,.reply-form
classes in blog components.
6.1.4
Fixes:
- Solved problem with this.changes.disconnect is undefined in mdbInputDirective.
6.1.3
New Features:
- Icons are now component.
<mdb-icon></mdb-icon>
supports only Font Awesome icons. Available field: icon (icon class), size (icon size), class (custom class for example color), - Number input now listens for key events. Added functionality to increment / decrement it's value by 10 or 0.1 by using shift + up / down arrow or alt + up / down arrow keys. Available by using mdbInputDirective
Fixes:
- Fixed problems with Carousel when using Angular Universal,
- mdbInputDirective validation has ben rewritten. Now works with Angular Validators,
- Fixed problem with no backdrop in sidenav on mobile,
- Fixed problem with sidenavBreakpoint.
6.1.2
Admin Templates:
- We have provided users with the option to make their own changes to the source code and compile the library into JavaScript.
New Features:
- Added possibility to use .filled-in class in Multiple Select by using customClass=" 'filled-in' " field,
- Added possibility to set custom sidenav breakpoint by using sidenavBreakpoint="desired-value" control on mdb-sidenav element,
- Added option to define custom locale for datePicker without modifying datepickerLocale.service source file,
Fixes:
- Fixed problem with fluid modal-bottom,
- Fixed problem with modal height while using datepicker in modal,
- Fixed label lifting-up in Autocomplete,
- Fixed problem with Material Dropdowns and dropup, dropleft, dropright variations,
- Rewriten Material Select animation.
6.1.1
NOTE: You may need to rename the modules you are using in your application. The list of modified modules is presented below.
In 6.1.1 we have made it possible to import only those modules that you actually use in your application.
If only individual modules are used, import them but do not import the MDBBootstrapModulesPro main module as
this
may cause errors.
What's new:
- Source code delivered to customers is now compilated to .js instead of .ts,
- There's now possibility to import only those modules, which you need in your project. Full modules list
- Changed names of few modules:
- MDBChartsModule -> ChartsModule,
- BsDropdownModule -> DropdownModule,
- MDBTooltipModule -> TooltipModule,
- SqueezeBoxModule -> AccordionModule,
- Ng2CompleterModule -> AutocompleteModule,
- MDBDatePickerModule -> DatepickerModule,
- MDBUploaderModule -> FileInputModule,
- MDBPageScrollModule -> SmoothscrollModule,
- MdbStickyModule -> StickyContentModule,
- MaterialRootModule -> PreloadersModule.
Fixes:
- Fixed missing space in mdb-angular.scss file,
- Added close icon to Autocomplete,
- Fixed problem with prefilling Char Counter value,
- Fixed problem with overlapping label & error / success messages with mdbInputDirective,
- Fixed problem with focusing inputs through TAB key.
6.0.2
General:
- Changed Renderer to Renderer2,
Fixes:
- Unnable to scroll in Sidenav: Link,
- Fixed problems with skins,
- Fixed mobile view in DatePicker,
- Fixed problem with scrolling page to the top edge in datePicker,
- Fixed problem with scrolling page to the top edge in timePicker.
6.0.1
Fixes:
- Fix for dropdowns, dropup variation,
- Fix for fixed button when collapsing (need to pass $event in .toggle() method),
- Few fixes in scss
6.0.0
NOTE: Most of the components have been rebuilt. Please, check the ones you use in your project.
General:
- Compatible with MDB 4.5.1,
- Compatible with Angular 6.0.0-rc.5, rxjs 6.0.0-uncanny-rc.7 and rxjs-compat 6.0.0-uncanny-rc.7,
- Compatible with Angular CLI ^1.7.1.
NOTE 2: For proper using Angular 6 with MDB Angular 6 please check, if you're using rxjs in version at least 6.0.0-uncanny-rc.7 and rxjs-compat in version at least 6.0.0-uncanny-rc.7. Using older versions may produce errors and problems.
Marked as deprecated:
- mdbActive,
- mdbInputValidate,
- mdbDeepDirective,
- mdbRippleRadius.
mdbInputDirective has three of the above directives - mdbActive, mdbInputValidate and mdbDeepDirective.
mdbActive is used by default and we do not anticipate that you will be able to disable it.
mdbInputValidate is used by default, but the user can disable validation by using the [mdbValidate]="false" control on input which contains mdbInputDirective.
mdbDeepDirective is used by default when used on a checkbox or radio. It is possible to disable it by using [focusCheckbox]="false" and [focusRadio]="false".
mdbRippleRadius was changed to mdbWavesEffect. mdbRippleRadius will be deleted after next release.
Fixes:
- Fix for z-index in few scenarios (tabs & datePicker), navbar and other,
- Fixed clearUnselected in Autocomplete,
- Fix for mdbActive in Autocomplete.
Features:
- Added feature to close datePicker after selecting an date (closeAfterSelect: true) in datePicker options object.
Docs:
- New category Forms,
- Autocomplete, Inputs, Input Validation, Forms moved from Components to Forms,
- Material Select moved from Advanced to Forms,
- Input Groups moved from Extended to Forms,
- Added instructions how to update Angular projects: Read
- Added instructions how to create project with Angular Universal: Read
Changed syntax:
- Cards,
- Flipping Cards,
- Intros,
- Sections,
- Inputs,
- Footers,
- Preloaders,
- Masks,
- Hover Effects,
- Accordion,
- Modals.
5.2.3
- Compatibility with Angular Universal (Server-Side Rendering) Read tutorial.
- Improved dropdown animation in Material Select
- Fixed problem with dropdown transition in Material Select
- "Not Found" message in Material Select will be visible only when filtering does not show results.
- Fix for top / bottom arrow in Material Select
- Added possibility to overwrite $image-path variable
5.2.2
- Fix for npm distribution (only)
5.2.1
- Enhanced mdbActive directive - works with data prefilled by browser
- Sidenav issue fixed (skin is optional)
- Fixed with rounded buttons inside input group
- Fixed for dropdown not getting closed after click in other dropdown.
- Fix for line breaking label in checkboxes
5.2.0
- Updated to Bootstrap 4 stable version
- Integration with .NET CORE - tutorial here
- Compatibility with Angular 5.2.1 and CLI 1.6.5
-
noImplicitAny
andstrictNullChecks
compatibility - New validation added (number, tel, submit) + custom validation regex. Read tutorial.
- Configurable labels for DatePicker
5.1.2
- Angular 5.2.1 and CLI 1.6.5 compatibility
- Extended docs for modals - auto focus on input
- Fixed validation for email and password
- Aria attributes added to datepicker
- Added filtering options to Material Select
- Support for IE+ and Edge for Double Navigation
- Extended DatePicker with new functionality:
Important!
By default date picker will load now +- 7 years starting from current year. It can be overwritten using
minYear
and maxYear parameters:
import { Component } from '@angular/core';
import { IMyOptions } from 'your_path_to/date-picker/index';
@Component({
selector: 'date-picker-component-example',
templateUrl: 'toast.component.html'
})
export class DatePickerComponentExample {
public myDatePickerOptions: IMyOptions = {
minYear: 2015,
maxYear: 2017
};
}
5.1.1
- Double navigation - support for collapsed sidenav and navbar
- Extended documentation for Autocomplete
- Auto resize function for collapse added
- Mobile gestures carousel support added
- Added option to hide next / prev buttons in carousel
- Fix for: Module has no exported member 'MDBSpinningPreloader'
- Automatically set date in DatePicker using ngModel
- Fixed docs for File Upload
5.1.0
- Angular 5.1.3 and CLI 1.6.3. compatibility
- Fixed issue with exceeding text tabs component
- Auto-close navbar after click into link (check documentation for more information)
- Fixed problem with error/success message on Firefox
- Fixed problems with selecting hour on mobile devices in Timepicker
- Extended configuration options of easy pie charts (check documentation for more information)
- Fixed for relative path in _skins.scss
- Fixed issue with date picker for Firefox
- Enhanced support for small screen resolution in Datepicker ( <575 px)
- Fix for issue while using multiple MDB Autocomplete components
5.0.5
noUnusedLocals
5.0.4
noUnusedParameters
5.0.3
5.0.2
5.0.1
5.0.0
Version 5.0.0 brings brings compatibility with new Angular 5.0 and CLI 1.5. Except for that new update include Bootstrap 4 Beta 2 assets.
- Restored `.offset-*` classes
- Switched Breadcrumbs from `float` to Flexbox
- Dropped support for Bower
What's new in Bootstrap 4 beta-2:
Important information
Although Angular 5.0.0 and CLI 1.5.0 are marked as stable releases, there are still quite a few open issues related to the released out of which some (i.e. this: #8284)have impact on MDB (as well as other plugins). Currently we are awaiting for Angular team to resolve that issue, meanwhile please use following workaround:
add following into tsconfig.json file located in *root* folder
"include": ["node_modules/angular-bootstrap-md/**/*.ts", "src/**/*.ts"],
(note: there is also tsconfig.app.json file inside src folder, however if you want to use it, path should be different)
"include": [ "**/*.ts", "../node_modules/angular-bootstrap-md/index.ts" ]
4.3.7
Version 4.3.7 brings few bugfixes and enhancements
- Lightbox support for
ESC
key to close. - Enhanced chart documentation
- Fix for sidenav resizing behaviour while changing the window size
- Fixed issue "ERROR ReferenceError: event is not defined" for mdb-select
- Added markers support to Google Maps
- Fixed e-mail validation issue for input type="email"
- Fixed issue with 24H time-picker not working
- Fixed issue "ToastrModule is already loaded"
Since version 4.3.7 , Toast Service has to be imported separately as singleton to avoid circular dependencies.
Import Toast Service as singleton:
app.module.ts
import { ToastModule } from ‘ng-mdb-pro/pro/alerts’;
...
imports: [
...
ToastModule.forRoot(),
...
],
app.component.ts
import {ToastService} from '../../typescripts/pro/alerts'
...
constructor(
...
private toast: ToastService
...
) { }
Sample usage:
ngOnInit() {
setTimeout(
() => this.toast.info("It works!")
);
}
4.3.6
Fixed issue with webpack build (relative path to img/overlays)
4.3.5
Fixed scss imports
Updated How to install
4.3.4
Npm install fix
4.3.3
Scss files update
4.3.2
Fixed production build.
4.3.1
Template url fix for: carousel, dropdown, modalBackdrop, modalContainer, navbar, popover, tooltip.
4.3.0
Version 4.3.0 brings plenty of important changes. We have updated every single component and directive.
We've reviewed our code, and have fixed about 892 errors. Now, our product reached the new level of quality. We've raised our code quality to meet quality standards designed by Google's Angular team.
-
Directives - camelCase and
mdb
prefix -
Components - kebab-case and
mdb
prefix
Most important changes (backward compatibility dropped):
-
Consistent indent of 2 spaces
-
Use of
hostBinding
andhostListner
instead ofhost
property -
Private, public and instance both methods and variables has been sorted in files (recommended by Angular, it helps with readability)
-
Each template has been moved to seperate file (except of one-liners)
-
And many more tiny quality improvements ...
Other changes (doesn't affext compatibility)
Version Disclaimer
This is major release, however to stay consistent with Angular's, and Bootstrap's versioning we decided to stay with 4 to omit any confuses in MDB Angular Community. Backwards compatibility has been completly dropped.
4.2.0.
That's the most significant update in the history of MDBootstrap. Together with the newest Bootstrap, we introduce you a brand new, completely rewritten MDB.
We took a lot of effort to provide a backward compatibility with the previous versions. Nonetheless, some syntax changes are inevitable (mostly caused by Bootstrap changes).
We've prepared a detailed list of syntax changes. The process of migration won't be painful, don't worry. However, we recommend you to read carefully a detailed list of changes. You can find it below.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
Note 1: For MDB Angular 4.2 beta we use an experimental version of Bootstrap 4 beta, not published yet. You can find a documentation for this Bootstrap version here.
Note 2: If you wish you can still download a stable version of MDB Angular Free 4.1.0 here. Legacy documentation for MDB Angular 4.1.0 is available here.
Note 3: If you are MDB Pro User and you whish to download MDB Pro 4.1.0 version write us on email: contact@mdbootstrap.com .
Note 4: To provide a proper rendering of our website we recommend to clear the browser cache.
-
Improved design
-
New, improved and extended documentation
-
Completely rewritten, with the highest standards, SASS code
-
Unified and simplified syntax
-
Updated and improved JS plugins
Most important changes (backward compatibility provided):
-
Removed unused variables and classes
-
Changed spacing utilities
-
Updated colors (warning, danger, info, success)
-
Customization made easier
-
New contact form
-
Recreated parallax
-
Introduced gradients
-
Dropped jumbotron for cascading card
-
Improved cascading cards
-
Added gradient cards
-
Added enhanced bootstrap modals
-
Updated overlay cards
-
Improved pricings section
-
Social list moved to deprecated
-
Added border-radius to material dropdowns
-
Improved design
-
Updated accordion
-
Added new versions of streaks
-
Recreated intros
-
Improved sidenav
-
Fixed caret issue for material select
-
Added animations to: tooltip, popover, alerts, dropdowns
-
Fixed rotating card animation (from left to right side)
-
Fixed input active class with dynamically added values
-
Updated alerts module plugin
-
Added slide animation for carousel
-
Added mobile section
Other changes (backward compatibility provided) :
-
.navbar-expand
instead of.navbar-toggleable
-
Removed nearly all
.hidden-*
classes in favor of our newer.d-*
display utilities -
Renamed
.btn-mdb
to.btn-mdb-color
for better naming scheme -
.btn-sm
and.btn-lg
instead of.btn-small
and.btn-large
for.btn-floating
Changes that can cause issues to project built with previous versions of MDB:
-
MDB Angular Admin Dashboard
-
MDB React
-
MDB Vue
Coming soon:
Beta Disclaimer
It is up to you to take precaution against damages resulting from this beta software. Software in beta testing should for example not be used on sensitive and/or valuable data. The usage of beta software is at your own risk and may void the warranty on your products. If you are not an experienced user, or otherwise in any doubt of your capabilities to make such a decision, please user our stable release MDB 4.1.0. In no event the software provider shall be liable to you for any damages, including damages arising out of the use or inability to use the beta software.
4.1.0 version adds Sections and fixes few minor bugs.
-
10 Sections, which show what you can create with our angular components.
-
Update of the documentation: more information about options and methods of components
-
Removed from project and re-added as npm dependency google maps
-
Fixed ripple effect issue
-
Fixed mdbActive directive issue
Changes: