angualr6 使用ng-zorro 改变nzStyle 但是样式没有变化

Question

现在是想获取日期选择器所在栅格宽度 修改日期选择器的宽度 宽度是获取到了
但是还是初始的style值

  <div nz-col nzSpan='8' nzOffset='1' class="datepicker-wrapper">
                  <nz-form-item>
                    <nz-form-control nzSpan="24">
                      <nz-date-picker [nzStyle]='style' [formControlName]="control.start_at" [attr.id]="control.id" placeholder='开始时间' nzFormat="yyyy-MM-dd"></nz-date-picker>
                      <nz-form-explain *ngIf="getFormControl(control.start_at)?.dirty&&getFormControl(control.start_at)?.hasError('required')">请选择开始时间</nz-form-explain>
                    </nz-form-control>
                  </nz-form-item>
                </div>
                

                  style = {
    width: "200px"
  }
ngOnInit() {
    this.onSearchVehicle();
    this.addField();
  }
  ngAfterViewInit() {
    setTimeout(() => {
      this.datepicker_w = this.el.nativeElement.querySelector('.datepicker-wrapper').offsetWidth
      console.log(this.datepicker_w);
      this.style['width'] = `${this.datepicker_w}px`,
        console.log(this.style)
    }, 0)
  }

打印的值是有的 但是并没有改变宽度 求大神指教

Answer 1

1.你先得去看组件解析的是的结构,确定你给那一层结构更改样式,然后按照解析之后的.class去进行更改
2.如果样式还不生效,使用::ng-deep,因为每一层解析后都有样式隔离

Answer 2

[ngStyle] = "{'width': style.width}"

Answer 3

写法有问题，this.style={'width':${this.datepicker_w}px};