当我将值从服务传递到我的 angular 组件时出现错误结果

Question

我创建了一个 Angular 服务，其中包含一个简单的字符串变量，然后在该服务中我更新了函数中的值。然后我在我的 component.ts 中调用这个函数（通过依赖注入），我得到了我的变量的初始值（目标是获取更新值）

这是服务：

import { Injectable } from '@angular/core';
import { environment } from '../../../environments/environment';
import { HttpService } from '../http/http.service';

@Injectable({
   providedIn: 'root',
})
export class MyService {
constructor() {}

callLogsToggle = 'on';

这是在此服务中创建的函数

public setHubspotTogglesStatus() {
 this.callLogsToggle = 'off'; //updated to off
}

这是我的component.ts

import { ActivatedRoute, Router } from '@angular/router';

@Component({
selector: 'my-selector',
templateUrl: './myCompo.component.html',
styleUrls: ['./myCompo.component.sass'],
})
export class MyComponent implements OnInit {

constructor(
    private mySevice: MyService,
    
) {
   this.myService.setHubspotTogglesStatus()
   console.log(this.mySevice.callLogsToggle) //The result is "on" 
                                            //The variable is not 
                                            //updated
    
}

那么对解决这个小问题有什么帮助吗？

Answer 1

你的方法需要 2 个参数，但你用 0 个参数调用它，尝试删除函数的参数并在你的构造函数中调用它或为其传递预期的参数。

在您调用的服务函数中打印任何值，以检查它是否正确到达该函数。

Answer 2

在您的服务文件中

import { Injectable } from '@angular/core';
import { environment } from '../../../environments/environment';
import { HttpService } from '../http/http.service';

@Injectable({
   providedIn: 'root',
})
export class MyService {
  callLogsToggle:string;
  constructor() {
   this.callLogsToggle = 'on';
  }

  public setHubspotTogglesStatus() {
    this.callLogsToggle = 'off'; //updated to off
  }

  public getcallLogsToggle():string {
    return this.service.callLogsToggle;
  }
}

在您的 component.ts 文件中

import { ActivatedRoute, Router } from '@angular/router';

@Component({
selector: 'my-selector',
templateUrl: './myCompo.component.html',
styleUrls: ['./myCompo.component.sass'],
})
export class MyComponent implements OnInit {

constructor( private mySevice: MyService) {}

ngOnInit(): void {
   this.myService.setHubspotTogglesStatus();
   console.log(this.mySevice.getcallLogsToggle());
 }

}

当我将值从服务传递到我的 angular 组件时出现错误结果

wrong result when I pass a value from a service to my angular component

javascript

service

components

typescript

angular