首页 > 解决方案 > 通过 url 获取 queryparams (JSON) - Angular 5

问题描述

我正在学习角度,并试图仅显示userName通过 URL 发送的 JSON 数据中的数据。但它没有返回userName我想要显示的具体内容。

错误是: TypeError:无法读取属性 'userName' of null

链接示例: http://10.20.30.40/abc?userInfo= hereIsTheJSON

JSON:

{ 
      "company":[
         {  
            "A":false,
            "B":4321,
            "C":null,
            "D":"TASTE",
            "E":1,
            "F":null
         },
         {  
            "A":true,
            "B":1234,
            "C":null,
            "D":"TEST",
            "E":0,      
            "F":null
         }
      ],
      "A":false,
      "C":null,
      "E":0,
      "F":null,
      "userName":"Ron Marks",
      "userId":"rMarks"
 }

.TS:

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  currentURL: string;
  newArr:any[];
  newObj: any;
  myparams: any;


  constructor(private route: ActivatedRoute,
  ) {

  }

  ngOnInit() {

    this.route.queryParams.subscribe(queryParams => {

      let userInfo = this.route.snapshot.queryParamMap.get('userInfo');
      this.newObj = JSON.parse(userInfo);
      console.log(this.newObj.userName);
    });

  }
} 

标签: jsonangular

解决方案


推荐阅读