fxFlex angular flex layout not working as expected version 7.0.0-beta.19

1
votes

Todo :

Here is my code and what i tried: 

<div fxLayout="row wrap" fxLayoutGap="32px" fxLayoutAlign="start start">
  <ng-container *ngFor="let _ of [1,2,3,4,5,6]">
    <p fxFlex="0 1 calc(33.3% - 32px)">Flex</p>
  </ng-container>
</div>

The documentation not provide a breaking change inside the api.
Has someone an idea what is going wrong here ?
or should i open an issue on github ?

1
angularangular-materialangular7angular-flex-layout
The first stackblitz isn't working for me, so I can't see what your desired output is. But I you want the 'Flex' to be on a row, I would use span instead of p – Mel
Hey your first stackblitz isnt working for me but the second. Did you maybe acctually switch them ? – Nikolai Kiefer
sorry i edited the link – billyjov
@Mel It should work for block elements. I edited my first link – billyjov

1 Answers

2
votes

You forgot to import FlexLayoutModule in app.module.ts

import { FlexLayoutModule } from '@angular/flex-layout';
import { AppComponent } from './app.component';
import { HelloComponent } from './hello.component';

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