错误类型错误:无法读取未定义的属性“”

时间:2020-12-29 13:54:32

标签: javascript angular html5-audio audiocontext

在我的角度组件中,我遇到了暴露 Float32Array 的 2 个变量的问题。

组件如下:

@Component({
selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
})
export class AppComponent implements OnInit {
  readonly data_freq = new Float32Array(100);
  readonly data_time = new Float32Array(100);

  mediaRecorder: MediaRecorder = {} as MediaRecorder;
  recording = false;

  ngOnInit(): void {
    navigator.mediaDevices
      .getUserMedia({ audio: true, video: false })
      .then(this.spectrum)
      .catch(console.log);
  }

  spectrum(stream: MediaStream) {
    const audioCtx = new AudioContext({ sampleRate: 16000 });
    const analyser = audioCtx.createAnalyser();
    audioCtx.createMediaStreamSource(stream).connect(analyser);

    setInterval(() => {
      analyser.getFloatFrequencyData(this.data_freq);
      console.log(this.data_freq);

      analyser.getFloatFrequencyData(this.data_time);
      console.log(this.data_time);
    }, 3000);
  }

触发类型错误:无法读取未定义的属性“data_freq”。

如果我在频谱函数内移动变量声明,我可以让它工作

spectrum(stream: MediaStream) {
    const audioCtx = new AudioContext({ sampleRate: 16000 });
    const analyser = audioCtx.createAnalyser();
    audioCtx.createMediaStreamSource(stream).connect(analyser);

    const data_freq = new Float32Array(100);
    const data_time= new Float32Array(100);

    setInterval(() => {
      analyser.getFloatFrequencyData(data_freq);
      console.log(data_freq);

      analyser.getFloatFrequencyData(data_time);
      console.log(data_time);
    }, 3000);
  }

但在那场比赛之外我无法访问它。 是否可以将它们放在组件中?有人可以解释为什么会触发这个错误,因为变量是用 0 初始化的?

我尝试将它们声明为非只读,但仍然失败

0 个答案:

没有答案