类型 'void' 不可分配给类型 'string'

Question

我正在尝试使用库（echarts）创建图表，但我认为这是一个异步错误。 我想在方法 buildChartConfiguration 中使用方法 addSpacesToString。 “（属性）TitleOption.text？：字符串类型'void'不可分配给类型'string'”

我究竟做错了什么？ 我该怎么做？ 提前谢谢了。 愿原力与你同在。

   
    
        @Component({
          selector: 'bargraph',
          templateUrl: './bargraph.component.html',
          styleUrls: ['./bargraph.component.scss']
        })
        export class BarGraphComponent implements OnInit, graphComponent {
        
          constructor(private dService: dService) { }
          
      
          data:BehaviourSubject<any> =  new BehaviourSubject({})
    //here I create chartOption and the method that will create its data, chartConfiguration
          chartOption: EChartsOption;
          chartConfiguration: any = {};
        
        @Input() dashboard: string;
        @Input() dashboardItem: DashboardItem;
        
        
        
         ngOnInit(): void {  
          //we obtain bargraph data from a service
          this.dService.bargraph(this.dashboard, this.dashboardItem.id).subscribe((response) => {this.data= response})
        
          this.data.subscribe((response)=>{
            if(!response){
              return
            }
            this.buildChartConfiguration(response)
           })   
        }
        
        
        buildChartConfiguration(response:any){
    
    //Here, in 'text', shows the error. while response.barGraphValues.name returns
// a string (which I need to modify), when applying the method
//  this.addSpacesToString it returns 'undefined'.
       
         this.chartOption =   {
            title: {
              text: this.addSpacesToString(response.barGraphValues.name),
            },
            tooltip: {},
            legend: {
              data: ['sales']
            },
            yAxis: {
              data: ['Shirts', 'Cardigans', 'Chiffons', 'Pants', 'Heels', 'Socks']
            },
            xAxis: {},
         
            series: [
              {
                name: 'sales',
                type: 'bar',
                data: [5, 20, 36, 10, 10, 20],
               
              }
            ]   
          }
        
        
        } 
        
        
 
    }
        
        
           **addSpacesToString**(s:string){
          s = s.replace(/([A-Z])/g, ' $1').trim()
          console.log(s)
          }

Answer 1

您是否考虑过在将其分配给 this.configOptions 之前先构建完整的对象？

let options = {
... get spaced bar name ...
};
this.chartOption = options;

在 ng-echarts 中还有 [merge] 属性。 这可用于动态更新选项。 如果存在异步行为，则通过此属性分配这些变量。 我们在创建图表后使用它来更新数据。

Answer 2

我忘记了return addSpacesToString 。 因此它返回void ，它不适合界面。

addSpacesToString(s: string) {
  return s = s.replace(/([A-Z])/g, ' $1').trim()
  console.log(s)
}

Answer 3

我想您的“this.data”是 object，而不是可观察的

  ngOnInit(): void {  
      //we obtain bargraph data from a service
      this.dService.bargraph(this.dashboard, this.dashboardItem.id)
           .subscribe((response) => {
              this.data= response
              this.buildChartConfiguration(response)
      })
  }