Javascript 如何在angular中将JSON传递给@Input？

有没有办法将json文件作为值直接分配给@Input

假设我有config.json，如下所示

{
    "video": [
        {
            "videoSrc": "assets/video/test.mp4",
            "videoType": "video/mp4",
            "videoPlayPause": true,
            "videoStartOver": true,
            "videoWidth": 300,
            "videoHeight": 225 
        }
    ],
    "image": [
        {
            "imageSrc": "assets/image/test.jpg",
            "imageType": "jpg",
            "imgWidth": 300,
            "imgHeight": 225 
        }
    ]
}

在视频组件中，我需要从文件中获取视频对象

在video component.ts中，我有以下代码

    import { Component, OnInit, Input, ViewChild } from '@angular/core';

    @Component({
      selector: 'mrt-video-playback',
      templateUrl: './video-playback.component.html',
      styleUrls: ['./video-playback.component.scss']
    })
    export class VideoPlaybackComponent implements OnInit {

      @Input() videoConfiguration: object = config.json;

 }

在html中

<div> {{videoConfiguration}} </div>

但是我得到了一个这样的东西，我应该从json获取对象，并需要将其存储到@Input

---

在config.json文件中，我需要获取视频对象并将其传递到html，因为它是视频组件，我需要将值从视频传递到html。由于我使用了@Input，它也可以在其他组件中使用。

如果您想将数据从子级传递到父级，那么您必须使用输出属性绑定，我在这里提供了一个示例，请检查此示例：

您可以使用JSON.parse（）

但如果您将输入传递给选择器“mrt video playback”，则会覆盖其值

<mrt-video-playback [videoConfiguration]="anyObject">

或

也可以将此值传递给选择器

<mrt-video-playback [videoConfiguration]="configJson"> </mrt-video-playback>
 ngOnInit(){
          this._http.get('assets/config.json')
          .subscribe((response) => { 
                   this.configJson = JSON.parse(response.video)
          });
     }

恩戈尼尼特（）{
这是http.get（'assets/config.json'）
.subscribe（（响应）=>{
this.configJson=JSON.parse（response.video）
});
}

您可以对文件进行

JSON.parse

并将其作为输入进行传递您希望将数据从父级传递到子级还是将数据发送到子级parent@ChellappanV,是的，我想将数据从父级传递到子级。你能提供将数据从子级传递到父级的解决方案吗？因为我希望这两方面都有解决方案，因为我是初学者，这将更有帮助。

<mrt-video-playback [videoConfiguration]="anyObject">

<mrt-video-playback [videoConfiguration]="configJson"> </mrt-video-playback>
 ngOnInit(){
          this._http.get('assets/config.json')
          .subscribe((response) => { 
                   this.configJson = JSON.parse(response.video)
          });
     }