fxHide и fxShow не работают

Question

Не знаю, делаю ли я что-то не так, но fxHide и fxShow не работают в @ angular / flex-layout.

<p fxHide> Start editing to see some magic happen :) </p>

Я использую следующие зависимости:

"@angular/animations": "^9.1.9",
"@angular/cdk": "^9.2.4",
"@angular/common": "^9.1.9",
"@angular/compiler": "^9.1.9",
"@angular/core": "^9.1.9",
"@angular/flex-layout": "^9.0.0-beta.31"

Вот Stackblitz код для справки.

Answer 1

Импортируйте FlexLayoutModule в свой app.module.ts:

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { FlexModule, FlexLayoutModule } from '@angular/flex-layout';
import { CommonModule } from '@angular/common';
import { AppComponent } from './app.component';
import { HelloComponent } from './hello.component';

@NgModule({
  imports: [ 
      BrowserModule, 
      FormsModule, 
      FlexModule, 
      FlexLayoutModule, 
      CommonModule ],
  declarations: [ AppComponent, HelloComponent ],
  bootstrap:    [ AppComponent ]
})
export class AppModule { }

Answer 2

Импортируйте FlexLayoutModule с FlexModule в свой модуль приложения. Будет работать.