Question

我有一个服务，我在其中设置ID，我在点击事件中从另一个组件获取此ID。

export class MyService {

   id: number;
   constructor() {}

   public setId(value: number) {
          this.id = value;
          console.log('id:', this.id);
   }
}

我在菜单组件中的点击事件中设置了值：

<a [routerLink]="['item.id]" (click)="getId(item.id);">

在菜单组件中触发此方法：

getId(datavalue: number) 
      {
            this.ms.setId(datavalue);
      }

如何将相同的值发送到另一个组件，以便我可以用它在HTML中显示？

class MyComponent implements OnInit
{
   id: number;

   constructor(private ms: MyService)
    {
       this.id = ms.id;
       console.log('ms id = ', this.id);
    }

我在上面的示例中尝试过，但我在控制台日志中得到“未定义”。

Answer 1

编辑：不要在服务中使用EventEmitter，这只是一个快速的解决方法！这篇文章涵盖了您的所有需求：Delegation: EventEmitter or Observable in Angular

~~您可以在服务中使用 EventEmitter ：~~

  id: number;
  idUpdated = new EventEmitter();

  setId(value: number) 
  {
         this.id = value;
         this.idUpdated.emit(this.id);
         console.log('id:', this.id);
  }

  getId() {
    return this.id;
  }

然后订阅以更改详细信息组件中的属性：

id: number;
ngOnInit()
   {
    this.ms.idUpdated.subscribe(
        (id) => {
          this.id = this.ms.getId();
          console.log(this.id);
        }
      );
   }

从服务到另一个组件的角度发送值

1 个答案: