表元素突然消失。怎么解决这个？我分享了在modal-body

modal-body为空时的状态

在模态正文中输入编辑表单时的状态

HTML代码

    <div class="jumbotron"> 
       <h3 class='text-center' > Pending Entries </h3>
      </div>
    
      <table class="table">
       <thead>
         <tr>
           <!-- <th scope="col">#id</th> -->
           <th scope="col">Pincode</th>
           <th scope="col">MajorDS A</th>
           <th scope="col">MinorDS A</th>
           <th scope="col">MajorDS B</th>
           <th scope="col">MinorDS B</th>
           <th scope="col">Action</th>
    
         </tr>
       </thead>
       <tbody>
         <tr *ngFor="let entry of collection">
          <!-- <td>{{entry.id}}</td> -->
          <td>{{entry.pincode}}</td>
           <td>{{entry.majorDamageInSubdivision_A}}</td>
          <td>{{entry.minorDamageInSubdivision_A}}</td> 
          <td>{{entry.majorDamageInSubdivision_B}}</td>
          <td>{{entry.minorDamageInSubdivision_B}}</td>  
           
          <td><i href="#modal-1" type = "button" class="fa fa-edit" data-toggle="modal" data-target="#exampleModalScrollable" style="font-size:30px;color:rgb(25, 0, 255)"> </i>&nbsp; &nbsp;
           <!-- Update Modal -->
            
             <div class="modal fade" id="exampleModalScrollable" tabindex="-1" role="dialog" aria-labelledby="exampleModalScrollableTitle" aria-hidden="true">
              <div class="modal-dialog modal-dialog-scrollable" role="document">
                <div class="modal-content">
                  <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalScrollableTitle">Edit & Update Entry</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                      <span aria-hidden="true">&times;</span>
                    </button>
                  </div>
                  <div class="modal-body">
                     <form>
                      <div class="form-group">
                     
                        <label >Pincode</label>
                        <input type="text" class="form-control" placeholder="Enter Pincode" formControlName="pincode">
                        <br>
                        
                     
                     
                        <label>Major Damage Score in Subdivision A</label>
                        <input type="text" class="form-control" formControlName="majorDamageInSubdivision_A">
                        <br>
                     
                      <label>Minor Damage Score in Subdivision A</label>
                        <input type="text" class="form-control" formControlName="minorDamageInSubdivision_A">
                        <br>
                     
                        <label>Major Damage Score in Subdivision B</label>
                        <input type="text" class="form-control" formControlName="majorDamageInSubdivision_B">
                        <br>
                        <label>Minor Damage Score in Subdivision B</label>
                        <input type="text" class="form-control" formControlName="minorDamageInSubdivision_B">
                        <br>
                      </div>
                    
                    </form> 
                  </div>
                  <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                    <button type="button" class="btn btn-primary">Save changes</button>
                  </div>
                
                </div>
              </div>
            </div> 
           
            
           
        <i type="button" class="fa fa-trash"  data-toggle="modal" data-target="#exampleModalScrollable" style="font-size:30px;color:red"></i></td> 
           
    
         </tr>
       </tbody>
      </table> 

我以为是因为表单的长度，但当我输入1000字的长段落时，所有的表元素都完好无损。

顺晟科技：