angularjs - 串联调用角度方法-Highcharts

Question

我只是学习 Angular 和高脚椅的新手。我的问题是如何串联调用角度方法来动态呈现图表。我提到了这个链接，但我对此一无所知：链接：https ://www.highcharts.com/blog/tutorials/194-using-highcharts-with-angular-js/ 。链接：当我们点击highchart系列时调用一个角度组件方法 请应用我来解决这个问题。

app.component.ts

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

import { HttpClient } from '@angular/common/http';


@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  name:string = '';
  age:number;
  found:boolean;

  constructor(private httpClient: HttpClient) { }  
  onNameKeyUp(event:any){
      this.name = event.target.value;
      this.found = false;
  }
getProfile(){
    this.httpClient.get(`https://my-json-server.typicode.com/techsithgit/json-faker-directory/profiles/?name=${this.name}`)
    .subscribe(
        (data:any[] )=>{
            if(data.length){
                this.age = data[0].age;
                this.found = true;

            }
        }
   )
}

}

app.component.html

<input type ="text" (keyup) = "onNameKeyUp($event)">
<button (click)= "getProfile()">Get User Details</button>
<br>

<div *ngIf="found" >
<span>{{name}}'s age is {{age}}</span>


</div>

标签： angularjshighcharts