[Angular TypeScript报错]Cannot assign to read only property ‘outwardcolor‘ of object ‘[object Object]‘

事情发生过程
用动态路由从一个组件传一个对象到另一个组件接收时发生的错误
源码:
对象 selected

export interface selected {
  model?: string;
  outwardcolor?: string;
  outwardwheel?: string;
  interior?: string;
  features?: string;
  pay?: string;
}

接收方的ts文件(只有重点部分)

  public chosen: selected = <any>{};
  constructor(private router: Router, private arouter: ActivatedRoute) { }

  ngOnInit(): void {
    this.arouter.params.subscribe((data: selected) =>{
      this.chosen = data;
    });
  public selectColor(color: string){
	this.chosen.outwardcolor = color;
	}

当我调用这个函数时 问题就来了
[Angular TypeScript报错]Cannot assign to read only property ‘outwardcolor‘ of object ‘[object Object]‘
这个问题的玄学之处在于 在初始化赋值后 初始化结束前 它还是个对象

	this.chosen.outwardcolor = 'color';

这还是成立的

但是一到方法中这个对象就变成了 object
object 与json 对象的差别在于有没有外面那层{}

所以解决方法就是
在给它设值之前给它加个{}

    let o ={};
    let newchosen = Object.assign(o, this.chosen);

此时 这个newchosen 又重新变成了对象
这个时候在给他赋值就没问题了

newchosen.outwarcolor = color ;

this.chosen 与 newchosen 在F12中看似相近 但其实是有差的!!!!
[Angular TypeScript报错]Cannot assign to read only property ‘outwardcolor‘ of object ‘[object Object]‘

问题解决

感谢我的老师,and

引用文章: https://blog.csdn.net/tooby/article/details/84902746

上一篇:大型项目技术栈第七讲 Chosen的使用


下一篇:个人自学前端11-JS4-数组和循环