मैं अपने प्रोजेक्ट में कोणीय ग्रिड का उपयोग कर रहा हूं। सेल सामग्री बढ़ने पर मैं स्वचालित रूप से पंक्ति ऊंचाई बढ़ाना चाहता हूं। मैंने ऑटो के रूप में सेट करने के लिए ऑटोहाइट संपत्ति की जांच की लेकिन यह मेरे मामले में काम नहीं कर रहा है।

मेरे मामले में OldRequestNumber में कई डेटा हो सकते हैं जो कई पंक्तियों में फैले होते हैं। नीचे आवेदन करने पर यह सूची घटना में केवल पहला दिखा रहा है सूची में और भी हैं

एचटीएमएल पेज

<ag-grid-angular style="width: 100%; height: 200px"
                     class="ag-theme-balham"
                     [pagination]="true"
                     [gridOptions]="genderGridOptions"
                     [rowData]="genderRowData"                     
                     [columnDefs]="genderColDef"
                     (gridReady)="onGridReady($event)">
    </ag-grid-angular>

घटक पृष्ठ(*.ts)

export class GenderComponent implements OnInit {
    genderRowData: []; 
    genderColDef = [
        {
            headerName: 'Gender Name', field: 'Name',            
            autoHeight: true,                                      
        },
        {
            headerName: 'Request Number', field: 'RequestNumber',          
            autoHeight: true,                   
        },
        {
            headerName: 'OldRequestNumber(s)',
            cellRendererFramework: OldRequestRendererComponent,
            autoHeight: true,
        },        
    ];

    constructor(private genderCommonService: CommonFunctionService, private genderCellValueService: CellValueChangedService) {
    }

    ngOnInit() {
        this.genderCommonService.getEntityData('getallgenders')
            .subscribe((rowData) => this.genderRowData = rowData,
                (error) => { alert(error) }
            );
    }

    onGridReady(params: any) {
        params.api.sizeColumnsToFit();
        params.api.resetRowHeights();
    } 
}

सेल रेंडरर HTML

<div *ngFor="let req of params.data.OldRequestNumber">     
    {{req.RequestNumber}}
</div>

सेल रेंडरर घटक

export class OldRequestRendererComponent {
    private params: any;

    agInit(params: any): void {
        this.params = params;        
    }

}

इसे कैसे हासिल करें?

3
simple user 6 अगस्त 2019, 06:44

2 जवाब

सबसे बढ़िया उत्तर

मैंने कार्यक्षमता प्राप्त करने के लिए निम्नलिखित परिवर्तन किए हैं: -

एचटीएमएल पेज

<ag-grid-angular style="width: 100%; height: 200px"
                     class="ag-theme-balham"
                     [pagination]="true"
                     [gridOptions]="genderGridOptions"
                     [rowData]="genderRowData"                     
                     [columnDefs]="genderColDef"
                     [getRowHeight]="getRowHeight"     //Added this line
                     (gridReady)="onGridReady($event)">
    </ag-grid-angular>

घटक पृष्ठ(*.ts)

संशोधित ngOnInit () और कंस्ट्रक्टर ()

ngOnInit()
    {        
        this.genderCommonService.getEntityData('getallgenders')
            .subscribe((rowData) => {
                rowData.forEach(function (dataItem: any, index) {                                  
                    dataItem.rowHeight = 25 * dataItem.OldRequestNumber.length;                    
                });
                this.genderRowData = rowData
            },
                (error) => { alert(error) }
            );  

    } 

constructor(private genderCommonService: CommonFunctionService, private genderCellValueService: CellValueChangedService) {

          this.getRowHeight = function (params : any) {
                 return params.data.rowHeight;
          };


}

आशा है कि इससे सहायता मिलेगी।

0
simple user 15 अगस्त 2019, 07:30

यह इस तरह काम करेगा। इसे नीचे की तरह आज़माएं

{ headerName: 'Date', field: 'date', width: 175, cellStyle: { "white-space": "normal" }, autoHeight: true },

सेल स्टाइल शामिल करें: {"व्हाइट-स्पेस": "नॉर्मल"} तभी यह काम करेगा।

1
ankit mishra 13 फरवरी 2020, 10:03