angular - چگونه میتوان حلقه *ngFor را طوری اجرا کرد که برای n-1 بار اول اجرا شود و دادههای آخرین ایندکس نمایش داده نشود؟

اچتیامال :

<div *ngIf="userdata; else blank;">                         
 <table>
  <thead>
   <tr>
    <th>Id</th>
    <th>Name</th>
    <th>Email</th>
    <th>Address</th>
    <th>Role</th>
    <th>Gender</th>
    <th>Actions</th>
   </tr>
  </thead>
  <tbody>
   <tr *ngFor="let data of userdata">                                          
    <td>{{data.Id}}</td>
    <td>{{data.Name}}</td>
    <td>{{data.Email}}</td>
    <td>{{data.Address}}</td>
    <td>{{data.Role}}</td>
    <td>{{data.Gender}}</td>
    <td>
     <button type="button" (click)="setUser(data)" class="btn btn-default btn-sm edit">
      <span class="glyphicon glyphicon-edit"/> Edit</button>                                              
     <button type="button" id="close" style="height: 30px;"
      (click)="deleteUser(data.Id)" class="btn btn-default btn-sm close" aria-label="Close">
      <span aria-hidden="true">&times;</span>
     </button>
    </td>                                           
   </tr>  
  </tbody>
 </table>
</div>
<ng-template #blank>No Records found...</ng-template>

این دقیقاً چیزی است که در آرایه userdata دریافت میکنم:

[{
    "Id": "1",
    "Name": "sdfd",
    "Email": "fdg",
    "Address": "dfg",
    "Role": "Admin",
    "Gender": "male"
}, {
    "Id": "2",
    "Name": "dgfhh",
    "Email": "gdh",
    "Address": "hhh",
    "Role": "User",
    "Gender": "female"
}, {
    "Id": "3",
    "Name": "dfgf",
    "Email": "fgdh",
    "Address": "fghd",
    "Role": "Super-Admin",
    "Gender": "male"
}, "{\"blank-email\":\"Email cannot be blank\",\"blank-role\":\"You must play some role\",\"blank-gender\":\"You must specify your Gender\"}"]

پس اینجا، من نمیخواهم این از آرایه اجرا شود:

{"blank-email":"ایمیل نمیتواند خالی باشد","blank-role":"شما باید نقش خود را ایفا کنید","blank-gender":"شما باید جنسیت خود را مشخص کنید"}

پاسخ شماره ۱

شما میتوانید *ngIf را اضافه کنید و عناصری را که آخر نیستند، نمایش دهید.

<tr *ngFor="let data of userdata; last as l">
   <ng-container *ngIf="!l">
     .....
   </ng-container>
</tr>

رویکرد نسبتاً خوبی این است که مجموعه viewModel را خودتان به بخشهای کوچکتر تقسیم کنید و ngFor را روی همان مجموعه نگه دارید تا آن را در رابط کاربری نمایش دهید.

پاسخ شماره ۲

من میگویم بهترین کار این است که در کنترلر آن آیتم آخر را حذف کنیم. من آن را به عنوان یک روش بهتر در نظر میگیرم که این منطق در کنترلر باقی بماند تا در نمای (view).

من به طور خاص با Angular آشنایی ندارم اما به طور کلی ممکن است بخواهید از یک ویژگی محاسبهشده استفاده کنید. یک جستجوی سریع اینجا انجام دادم و این پاسخ را با یک مثال در مورد نحوه انجام آن پیدا کردم.

امیدوارم مفید باشد.