Угловой 12 — NgMaterialMultilevelMenuModule — Проблема отображения

#angular #angular-module

#угловой #угловой модуль

Вопрос:

(Заранее извините, если теги плохие)

Я пытаюсь использовать модуль NgMaterialMultilevelMenuModule для создания многоуровневого меню (логика). Я нашел учебники, но что бы я ни делал, они ничего не показывают, и после того, как я вызову модуль, и он не покажет, что будет после в html-файле (я вижу только «Меню»). Я скопировал/вставил пример кода, я что-то пропустил ? Я совсем новичок в angular.

Заранее спасибо

.html компонента:

 lt;pgt;Menult;/pgt;  lt;ng-material-multilevel-menu   [configuration]='config'   [items]='appitems'  (selectedItem)="selectedItem($event)"gt; lt;/ng-material-multilevel-menugt;  lt;pgt; test lt;/pgt;  

.ts компонента:

 import { Component } from '@angular/core';  @Component({  selector: 'app-menu-donnees',  templateUrl: './menu-donnees.component.html',  styleUrls: ['./menu-donnees.component.css'] }) export class MenuDonneesComponent {   appitems = [  {  label: 'Item 1 (with Font awesome icon)',  faIcon: 'fab fa-500px',  items: [  {  label: 'Item 1.1',  link: '/item-1-1',  faIcon: 'fab fa-accusoft'  },  {  label: 'Item 1.2',  faIcon: 'fab fa-accessible-icon',  items: [  {  label: 'Item 1.2.1',  link: '/item-1-2-1',  faIcon: 'fas fa-allergies'  },  {  label: 'Item 1.2.2',  faIcon: 'fas fa-ambulance',  items: [  {  label: 'Item 1.2.2.1',  link: 'item-1-2-2-1',  faIcon: 'fas fa-anchor'  }  ]  }  ]  }  ]  },  {  label: 'Item 2',  icon: 'alarm',  items: [  {  label: 'Item 2.1',  link: '/item-2-1',  icon: 'favorite'  },  {  label: 'Item 2.2',  link: '/item-2-2',  icon: 'favorite_border'  }  ]  },  {  label: 'Item 3',  link: '/item-3',  icon: 'offline_pin'  },  {  label: 'Item 4',  link: '/item-4',  icon: 'star_rate',  }  ];   config = {  paddingAtStart: true,  classname: 'my-custom-class',  listBackgroundColor: 'rgb(208, 241, 239)',  fontColor: 'rgb(8, 54, 71)',  backgroundColor: 'rgb(208, 241, 239)',  selectedListFontColor: 'red',  };    constructor() { }   selectedItem($event: any) {  console.log($event);  }    }  

Ответ №1:

Добрый вечер, сэр. Посмотрите, что говорит Консоль. введите описание изображения здесь

Я тоже не так хорош в угловом! но похоже, что у импортированного модуля отсутствует поставщик для его собственной службы. Может быть ошибка или неспособность версий.

Но это можно очень легко исправить. Все, что вам нужно сделать, это добавить своего собственного поставщика в свои AppModule providers свойства

… см. ниже

 providers: [  {provide:MultilevelMenuService,useClass:MultilevelMenuService} ],