时间戳

首页 > 解决方案 > 如何从组件初始化Angular服务，自定义类？

javascript - 如何从组件初始化Angular服务，自定义类？

问题描述

我使用Angular 元素

我的应用程序将引导组件作为 MapComponent。还有一个MapCore包含所有域逻辑的核心类：

class MapCore {
   constructor(props: Props) {
       // Config here
   }
}

这个核心类应该在整个 Angular 应用程序中共享。所以我可以让它可注入并在root中注册。

我需要从组件手动配置此类，因此我使用它：

@Component({
  selector: 'map-root',
  templateUrl: './map.component.html',
  styleUrls: ['./map.component.scss']
})
export class MapComponent {
    @Input() props: Props;
    @Input() center: Center;
    ngOnInit() {
         this.map = new MapCore(this.props);
    }
}

我需要它，因为当我得到自定义元素的结果时，我可以将参数传递给标记以配置地图：

<map-root center="56,90" props="props">

我的问题是，在我的情况下，如何配置服务是new MapCore来自组件的自定义类并在应用程序之间共享？

你能分享你的经验如何解决这个问题吗？

标签： javascriptangulartypescript

解决方案

我认为您可以使用@Injectable. 为此，您可以更新您的class姓名MapCore ，如下所示

import { Injectable } from '@angular/core';

 @Injectable({
      providedIn: 'root'
    })
    class MapCore {
       constructor(props: Props) {
           // Config here
       }
    }

它将在整个 Angular 应用程序中使用您的类，您可以像下面那样从任何组件中使用它=>

export class YourComponent {
  constructor(private mapCore : MapCore ){}
}

推荐阅读