问题可能是由于缺少必要的依赖项或配置问题引起的。以下是一些可能的解决方法:
npm install @angular/material
npm install materialize-css
然后,在angular.json
文件中添加必要的样式和脚本引用:
"styles": [
"../node_modules/materialize-css/dist/css/materialize.css",
"src/styles.css"
],
"scripts": [
"../node_modules/materialize-css/dist/js/materialize.js"
]
MaterializeService
:import { MaterializeService } from 'angular2-materialize';
// ...
export class MyComponent {
constructor(private materializeService: MaterializeService) {}
openModal() {
this.materializeService.toast('Modal Opened');
}
}
Open Modal
ngOnInit
生命周期钩子函数中,使用以下代码初始化和激活Modal:import { MaterializeService } from 'angular2-materialize';
// ...
export class MyComponent implements OnInit {
constructor(private materializeService: MaterializeService) {}
ngOnInit() {
// Initialize the modal
this.materializeService.initModal('#my-modal');
// Activate the modal
this.materializeService.openModal('#my-modal');
}
}
这些解决方法应该能够帮助您解决Angular 7上Materialize Modal未显示的问题。请根据您的具体情况适当调整代码和配置。