关于angular:本周遇到问题

问题一：须要进行深拷贝
情景：

this.divisionalWorksTemplateService.getById(id)
      .subscribe((value) => {
          this.chooseDivisionalWorksTemplate = value;
          this.divisionalWorksTemplate = value;
  })

咱们想要这两个变量初始值雷同，然而后须要进行的操作不同，然而如果咱们这样操作会导致这两个变量其实都指向同一个地址。
也就是说咱们进行如下操作：
this.chooseDivisionalWorksTemplate.name = 'test'
就会导致 divisionalWorksTemplate.name 也被改为了 test。
这时咱们就须要进行深拷贝，之前咱们也有说过能够间接应用 lodash 来进行深拷贝，如下：

import * as _ from 'lodash';

  .   .   .
 this.chooseDivisionalWorksTemplate = value;
 this.divisionalWorksTemplate = _.cloneDeep(this.chooseDivisionalWorksTemplate);

问题二：angular set 函数的触发

本周在 set 函数触发上遇到了问题：
数据筹备：

export interface TestFather{
  id: number
  testSons: TestSon[]}

export interface TestSon{
  id: number
  number: number
}

testSon：

  @Input()
  set testFather(testFather: TestFather) {console.log("传入 testFather" + testFather.id)
  }

  @Input()
  set testSon(testSon: TestSon) {console.log("传入 testSon" + testSon.id)
  }

  @Input()
  set number(number: number){console.log("传入 number" + number)
  }

  @Input()
  set testSons(testSons: TestSon[]) {console.log("传入 testSons" + testSons.length)
  }

testFather：

  testFather = {
    testSons: [
      {
        id: 1,
        number: 0,
      }
    ] as TestSon[]} as TestFather

  testSon = {number: 0} as TestSon

  testSons = [] as TestSon[]

  constructor() {}

  ngOnInit(): void {}

  addNumber(){this.testSon.number ++}
  addTestSon() {
    this.testFather.testSons.push({number: 1} as TestSon)
    this.testSons.push({number: Random.nextNumber()
    } as TestSon)
  }

  resetTestSon() {this.testSons = [];
  }

咱们别离把父对象，子对象，对象数组，number 类型数据传给子组件
咱们能够察看当各个参数发生变化时哪些会触发 set 函数。

首先就是 number 类型数据

与咱们预期雷同，每当 number 自增都会触发。

然而当 number 变动时并没有触发 testSon 的 set 函数，同样当 testSon 变动时也不会触发 testFather 的 set 函数。咱们能够得出当组件属性变动时并不会触发 set 函数。

然而当咱们向数组中推入新对象时也不会触发 set 函数，查看之前的代码后发现之前推入新对象都是采取赋值的办法，即给了一个新的对象数组, 艰深来说只有当对所传入的对象赋予新值的时候才会触发对应的 set 函数。