각도 4, ngIf 조건부 표시

Question

데이터 표시 조건을 수정하는 데 도움이됩니다. 비동기식 서비스를 통해 M 모델을 얻습니다. 모델> .something < 표기법을 사용하여 모델이 아직 정의되지 않은 경우 오류를 피할 수 있습니다. title이 null이거나 'somestring'입니다. 표현식에 문제가 있습니다. 내가 선택한 양식은 항상 하나의 사례를 표시합니다. 이 형식 표현을 일찍 피하고 정확하게 typescript로 변환 할 수 없습니다.

import { Component } from '@angular/core'; 
import { M } from './model'; 

@Component({ 
    selector: 'app-test', 
    template: ` 
<p *ngIf="model1?.title !== null"> 
    Display text if title exist('common string') 
</p> 
<p *ngIf="model2?.title === null"> 
    Display text if title equal to null 
</p> 
    `, 
    styleUrls: ['./test.component.css'] 
}) 

export class TestComponent { 
    model1: M; 
    model2: M; 
    constructor() { 
    this.model1 = { 
     title: 'username' 
    }; 
    this.model2 = { 
     title: null 
    }; 
    } 
} 

export class M { 
    public title: string; 

    public constructor(){} 
} 

Answer 1

시도하십시오

<h1 *ngIf="model1.title!==null"> 
    OK 
    </h1> 

    <h1 *ngIf="model2.title!==null"> 
    OK 
    </h1>