Как я могу изменить видимость div через событие click кнопки или ссылки, которая находится на другой странице (html) в Angular - PullRequest
Новая
       19

Как я могу изменить видимость div через событие click кнопки или ссылки, которая находится на другой странице (html) в Angular

0 голосов
/ 10 декабря 2018

Как я могу изменить видимость div через событие нажатия кнопки или ссылки, которая находится на другой странице (html)?У меня есть кнопка на странице «main.html», которую я хочу, и когда я нажимаю, она отображает скрытый div в «header.html».Есть ли способ для меня это сделать?

У меня есть в index.html:

<button type="button" class="btn btn-default px-4" [routerLink]="['../home']" (click)="">Entrar</button>

И в Header.html: 

            `<div class="page">
              Olá {{'usuario'}}, seja bem vindo! Hoje é dia {{today | date:'dd/MM/yyyy'}}
            </div>`

Div, который находится в header.html, должен быть скрыт, и когда я нажимаю кнопку, которая находится в index.html, она должна отображаться.

1 Ответ

0 голосов
/ 10 декабря 2018

Один из способов сделать это состоит в том, что вы генерируете событие, где бы кнопка не находилась: 

import { Component, EventEmitter, Output } from '@angular/core';

@Component({
    selector: 'btn-component',
    template: `<button type="button" class="btn btn-default px-4" [routerLink]="['../home']" (click)="buttonClicked()"> Entrar </button> `
})
export class ButtonComponent {
    @Output() buttonClickedEvent = new EventEmitter();
    public buttonClicked() { // You can give any function name
        this.buttonClickedEvent.emit("click!");
    }
}

, а затем вы ловите его на уровне 'div': 

`<div class="page" [hidden]="!showDiv" (buttonClickedEvent)='showDiv = !showDiv'>
      Olá {{'usuario'}}, seja bem vindo! Hoje é dia {{today | date:'dd/MM/yyyy'}}
</div>`

См.Подробнее об источниках событий здесь

...