mdbootstrap с угловой - анимация не работает
Я следовал этому руководству здесь: https://github.com/mdbootstrap/Angular-Bootstrap-with-Material-Design. И все выглядит так, как я ожидал, но анимация не работает. На этой демонстрационной странице: https://mdbootstrap.com/components/buttons/ При нажатии кнопки имеют волновой эффект, но когда я копирую / вставляю демонстрационный код в свой (test) app.component.html, то волны нет эффект.
Кажется, что некоторые обработчики событий не зарегистрированы, но я не уверен, как это сделать...
редактировать
После еще одного возни, я действительно узнал, как заставить рябь работать!:) Вот мой app.module.ts (импорт RippleModule важен):
import { NgModule, NO_ERRORS_SCHEMA } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { MDBBootstrapModule } from 'angular-bootstrap-md';
import { RippleModule } from 'angular-bootstrap-md/ripple';
import { AppComponent } from './app.component';
@NgModule({
declarations: [AppComponent],
imports: [
BrowserModule,
MDBBootstrapModule.forRoot(),
RippleModule.forRoot()
],
providers: [],
bootstrap: [AppComponent],
schemas: [NO_ERRORS_SCHEMA]
})
export class AppModule {}
Пример использования ряби на кнопке:
<!-- mdbRippleRadius attribute (directive) and the waves-light class is imporant -->
<button type="button" class="btn btn-primary waves-light" mdbRippleRadius >Primary</button>
1 ответ
Вам нужно добавить директиву mdbRippleRadius
в ваш HTML, если вы используете Angular.io.
<button type="button" class="btn btn-primary" mdbRippleRadius>Primary</button>
См. Угловая бутстрап с дизайном материала: