variable - Angular2*ng如果檢查模板中的對像數組長度




angular2 input value (4)

也許 ngx-if-empty-or-has-items 但是創建了庫 ngx-if-empty-or-has-items 它檢查對象,集合,映射或數組是否為空。 也許會幫助別人。 它具有與ngIf相同的功能(然後,支持else和'as'語法)。

arrayOrObjWithData = ['1'] || {id: 1}

<h1 *ngxIfNotEmpty="arrayOrObjWithData">
  You will see it
</h1>

 or 
 // store the result of async pipe in variable
 <h1 *ngxIfNotEmpty="arrayOrObjWithData$ | async as obj">
  {{obj.id}}
</h1>

 or

noData = [] || {}
<h1 *ngxIfHasItems="noData">
   You will NOT see it
</h1>

請參閱 https://angular.io/docs/ts/latest/guide/displaying-data.html 並堆棧 如何使用* ng檢查angular 2模板中的空對像如果 仍然遇到語法錯誤,則自身上下文未定義。 如果我刪除* ngIf條件,那麼如果我在其中添加一些值,那麼我將在teamMembers中獲取值,以便可以訪問teamMembers中的值。

我的 teamMember [ ] array 我正在嘗試檢查條件數組的大小是否為空。

嘗試:

<div class="row" *ngIf="(teamMembers | json) != '{}'">

<div class="row" *ngIf="teamMembers.length > 0"> //Check length great than
                                                 throwing syntax error
            <div class="col-md-12">
                <h4>Team Members</h4>
                <ul class="avatar" *ngFor="let member of teamMembers">
                    <li><a href=""><gravatar-image [size]="80" [email]="member.email"></gravatar-image></a></li>
                </ul>
            </div>
        </div>

零件 :

@Component({
selector: 'pbi-editor',
})
export class AppComponent implements OnInit {
teamMembers: User[];

任何幫助都會很棒。


您可以使用

<div class="col-sm-12" *ngIf="event.attendees?.length">

沒有 event.attendees?.length > 0 甚至沒有 event.attendees?length != 0

因為 ?.length 已經返回 布爾 值。

如果在數組中將是某些東西,它將不顯示。


這篇文章幫助我弄清楚了為什麼它對我也不起作用。 它給了我一個教訓,讓我思考一下網頁的加載以及角度2作為時間軸的交互方式,而不僅僅是我正在考慮的時間點。 我沒有看到其他人提到這一點,所以我會...

需要* ngIf的原因是因為它將嘗試在其餘OnInit東西發生之前檢查該變量的長度,並引發“ length undefined”錯誤。 那就是為什麼您要添加? 因為它尚不存在,但很快就會出現。


<div class="row" *ngIf="teamMembers?.length > 0">

這將首先檢查 teamMembers 是否具有值,以及 teamMembers 沒有值,因為條件的第一部分已經失敗,所以它不會嘗試訪問 undefined length





angular2-template