时间戳

首页 > 解决方案 > 如何以角度创建动态菜单

angular - 如何以角度创建动态菜单

问题描述

我有一个这样的界面

export interface INavData {
    name?: string;
    url?: string | any[];
    icon?: string;
  
}

我像这样将数据设置到这个界面

export const navItems: INavData[] = [
  {
    name: 'Dashboard',
    url: '/dashboard',
    icon: 'icon-speedometer'
  },
  {
    name: 'Colors',
    url: '/Category/subcategory',
    icon: 'icon-drop'
  },
  {
    name: 'Typography',
    url: '/Category/category',
    icon: 'icon-user'
  }
}

我在数据库中有一个 Menus 表，包含以下列 1.Name 2.Url 3.Icon 我使用 API 返回此表数据。现在如何从这个接口的 API 获取数据，你能帮助我吗朋友们非常感谢

注意：我在 Service 中获取数据，如下所示：

export class myService {
  readonly BaseURI = 'http://localhost:542213/api';
 constructor(private http: HttpClient) { }
 getMenus()
  {
    return this.http.get<Menus[]>(this.BaseURI + '/Menus');
  }
}

我想从 api 动态获取 Name,Url,Icon 值我该怎么做朋友

标签： angulartypescriptapiweb

解决方案

您可以使用这样的订阅方法从 api 获取数据到您的 .ts 文件中...

.ts

 import {myService} from 'PRTH';

 constructor(private _myService: myService)

 ngOnInit() {
   this.getMenuData()
 }

getMenuData(){
   this._myService.getMenus().subscribe((res)=>{
    console.log(res);             <-- this is your api Data
 });
}

现在您可以将 api 数据输入您的控制台....

推荐阅读