Angular2 * ngSe verificar o comprimento da matriz do objeto no modelo

Consultado em https://angular.io/docs/ts/latest/guide/displaying-data.html e empilhar Como verificar o objeto vazio no modelo angular 2 usando * ngIf ainda obtendo erro de sintaxe contexto próprio indefinido. Se eu remover a condição * ngIf, estou obtendo valores em teamMembers se inserir algum valor nela para que possa acessar os valores em teamMembers.

meu teamMemberobjeto é [ ] arrayque estou tentando verificar se a matriz de condição está vazia por tamanho.

Tentativas :

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

e

<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>

Componente:

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

Qualquer ajuda seria ótimo.

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

Isso verifica primeiro se teamMemberstem um valor e se teamMembersnão tem um valor, não tenta acessar lengthde undefinedporque a primeira parte da condição já falhou.

Você pode usar *ngIf="teamMembers != 0"para verificar se os dados estão presentes

Talvez um pouco exagero, mas a biblioteca ngx-if-empty-or-has-items criada verifica se um objeto, conjunto, mapa ou matriz não está vazio. Talvez ajude alguém. Tem a mesma funcionalidade que ngIf (então, senão e a sintaxe 'as' é suportada).

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>

Você pode usar

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

Sem event.attendees?.length > 0ou mesmoevent.attendees?length != 0

Porque ?.lengthjá retorna valor booleano .

Se em array for algo, ele o exibirá, do contrário não.

Este artigo me ajudou muito a descobrir por que não estava funcionando para mim também. Isso me deu uma lição para pensar no carregamento da página da web e como o angular 2 interage como uma linha do tempo e não apenas o momento em que estou pensando. Não vi ninguém mencionar esse ponto, então vou ...

A razão pela qual o * ngIf é necessário é que ele tentará verificar o comprimento dessa variável antes que o resto do OnInit aconteça, e lançará o erro "comprimento indefinido". Então é por isso que você adiciona o? porque ainda não existe, mas existirá em breve.