(Угловой 6) тег кнопки не отображается

Question

Привет!

Я пытаюсь создать форму входа в свое веб-приложение (Angular 6). Странно то, что мой тэг Button не отображается во внешнем интерфейсе. И нет ошибки компиляции.

Это моя кнопка:

<form [formGroup]="loginForm" class="form mt-4" (submit)="login()">
    <div class="form-group">
        <input
            formControlName="password" 
            type="password" 
            class="form-control" 
            placeholder="Password"><br>
        <vmessage
            *ngIf="loginForm.get('password').errors?.required"
            text=" Password is required!">
        </vmessage>               
    </div>

    <button [disabled]="loginForm.invalid" 
        type="submit">
        login
    </button>

</form>

А это CSS:

button
{
    display: initial;
    background-color: pink;
}

Любой другой тег работает, тег p, тег, тег div или просто текст. Они все появляются, но мне нужна кнопка из-за проверки формы. (кстати, простые теги кнопок тоже не появляются)

Это не имеет смысла для меня. Что мне здесь не хватает?

Answer 1

ТАК, мне удалось решить эту проблему, поместив тег кнопки внутри диапазона.

Если это кому-то поможет, вот как я это исправил:

<span *ngIf = "loginForm.valid" >Login 
    <button type="submit">
        login
    </button>
</span>