Mac Safari Class not affect on the DOM

Discussão em 'Angular' iniciado por yash chapani, Dezembro 4, 2024.

  1. yash chapani

    yash chapani Guest

    Please check below my code fitst

    <div [ngClass]="{'no-height': noTemplateFound}" class="masonry-container-wrap w-100 d-block grid" id="search-grid" appPinGrid [columns]="5" [gutter]="25" [data]="templateList" [itemClass]="'search-item'" [minColWidth]="150" [maxColWidth]="230"
    [doubleColumnWidth]="465" (onLayoutComplete)="layoutComplete()">
    <ng-container *ngIf="!dialogData.type">
    <div class="custom-design cust-temp-item-new gradient-loader-light" id="{{'masonry-item-'+i}}" *ngFor="let template_details of templateList;let i = index;" [style.background-color]="template_details.color_value" [style.opacity]="0">
    <div class="search-item-grid " >
    <a rel="nofollow">
    <img class="iso-grid-item img-fluid search-item m-0" [src]="template_details.thumbnail_image" (load)="removeLoader($event)" *ngIf="(template_details.is_free==0 || template_details.is_free==1) && login_response.user_detail.role_id != 1"
    (click)="template_details.is_free == 0 && (login_response.user_detail.subscr_expiration_time && utils.compareDateWithCurrentDate(login_response.user_detail.subscr_expiration_time) != -1 && login_response.user_detail.role_id != 1)?showPaymentDialog(template_details):chooseTemplate(template_details)">
    ```


    I have implement this type of to custome directive to load data but issue is when i scroll down the then api calling and directive called and its all working but that that component not affect on the dom only that class style show in insepect but not bind that class on the dom this isss only in **Mac Safari**

    this is my API Calling logic



    .then(async (results: any) => { this.isApiInProcess = false; if (results.data.content_list && results.data.content_list.length > 0 && payLoad.catalog_id == this.catalog_id) { console.log("Yeeep This Block Called......"); // for masonry layout await results.data.content_list.forEach(element => { that.templateList.push(element); }); this.isNextPage = results.data.is_next_page; this.appendItem(results.data.content_list, payLoad.catalog_id); await this.detectChangeInArray(this.templateList) this.noTemplateFound = false; }

    Continue reading...

Compartilhe esta Página