如果div在ngFor中,如何添加每个div的宽度?

时间:2017-11-21 13:44:31

标签: angular

<div #elementView [style.width]="width+'px'" class="{{fixed ? 'fixed-div' : ''}}" *ngFor="let event of events">
    <header class="sticky"><span>{{event.datetime}}</span><span>{{event.date}}</span></header>
    <time-flow class="time-flow-child  z-table-view" *ngIf="event.event && !event.itemKey" [events]="event.event" [positions]="positions" [selected]="selected"></time-flow>
    <event-flow  class="z-col-24 nopadding z-event-cell" *ngIf="event.items" [events]="event.items" [positions]="positions" [selected]="selected"></event-flow>
</div>

我的.ts文件:

  ngAfterViewInit() {
        if(this.elementView && this.elementView.nativeElement){
            this.width = this.elementView.nativeElement.offsetWidth;
            console.log(this.width,'aaaa');

        }

    }

我有这个代码。我想为他的宽度增加宽度。现在它需要一个宽度并添加到所有div上。任何建议如何解决这个问题?

编辑:

我成功地获得了所有div的宽度:

ngAfterViewInit() {
    this.skillImgs.forEach((skill: ElementRef) => {
        this.renderer.setElementStyle(skill.nativeElement,'width',skill.nativeElement.offsetWidth);
   });

}

但我现在不知道如何将它们传递给div。有什么建议吗?

1 个答案:

答案 0 :(得分:1)

您可以将div的width属性绑定到将返回宽度的方法。

byte[] bytes = File.ReadAllBytes("yourtextfile.txt");
string[] x = Encoding.UTF8.GetString(bytes).Split('*');

在您的.ts课程中

<div [style.width]="getElementWidth(event)" *ngFor="let event of events"></div>