Как мне показать через * ngIf - PullRequest
Новая
       7

Как мне показать через * ngIf

0 голосов
/ 13 июня 2019

Я хочу вызвать функцию * ngIf через мой home.component.ts.

html 

<GridLayout class="page">
<GridLayout row="0" rows="*, 2*, *">
    <GridLayout width="57%" row="0" horizontalAlignment="center" verticalAlignment="center">
       <button (click)="test()" text="testbutton"></button>
    </GridLayout>
    <GridLayout class="carousel-item-circle" row="1" horizontalAlignment="center" verticalAlignment="center">
        <label class="fa carousel-item-icon" text="&#xf130;" textWrap="true"></label>
    </GridLayout>
    <GridLayout *ngIf="testi" width="49%" row="2" horizontalAlignment="center" verticalAlignment="center">
        <Label class="text-color-blue opensans-regular carousel-item-desc" text="Mikrofon zum Sprechen antippen." textWrap="true"></Label>
    </GridLayout>
</GridLayout>

ts 

public vibrator = new Vibrate();
    public testi = true;

    constructor(private page: Page) {
        // Use the component constructor to inject providers.
    }

    ngOnInit(): void {
        this.page.actionBarHidden = true;
        this.page.addCss(".page-content { background: #000000");
    }

    vibrate(){
        this.vibrator.vibrate(2000);
    }

    test(){
        this.testi = !this.testi;
    }

Кажется, все так просто, но это не работает.Я что-то пропустил?

Ответы [ 2 ]

0 голосов
/ 13 июня 2019

Кнопка NativeScript использует tap, а не click. Так в вашем коде test() никогда не вызывается. 

<button (tap)="test()" text="testbutton"></button>

Обратитесь к руководству по началу работы и просмотрите доступные компоненты пользовательского интерфейса, чтобы понять основные различия.

0 голосов
/ 13 июня 2019

Вам нужно сделать переменную true / false при клике

Написать в своем HTML-файле 

<button (click)="test()">Click</button>
<span *ngIf="testi">NG IF</span>

Написать в свой файл TS Сначала объявите testi как 

testi = false

test(){
   testi = true;
}

Используя * ngIf, вы можете показывать элемент всякий раз, когда он истинный или не пустой, если он ложный или пустой, он не будет отображать элемент в браузере

Надеюсь, что это решит вашу проблему, спасибо

...