Flex-layout: lt-md not working as expected

[gtzinos]

   <div fxHide [fxHide.lt-md]="false" class="button-row">
        <button  (click)="sidenavClick()" md-icon-button>
            <md-icon>menu</md-icon>
        </button>
    </div>

ERROR:
Unhandled Promise rejection: Template parse errors:
Can't bind to 'fxHide.lt-md' since it isn't a known property of 'div'

Sorry but i can't find something in documentation.

[artur-kania]

@gtzinos The error message is correct. It's not a div's property.
Try without square brackets

<div fxHide fxHide.lt-md="false" class="button-row">

[gtzinos]

Yes i tryied it, but lt-md doesn't work. It doesn't return an error but just not works.

[dahaupt]

You could try to change it just to fxHide.gt-md.

[gtzinos]

Yes only md-(something) works. All lt-(something) don't work.

[AndrinGautschi]

fxLayout.lt-md="column" also doesn't work.
but fxLayout.xs="column" does.

edit: upgrading to latest (-beta7) fixed it for me.

[gtzinos]

I upgraded my packages and now md-(something) doen't work.

"private": true,
"dependencies": {
"@angular/animations": "^4.0.1",
"@angular/common": "^4.0.1",
"@angular/compiler": "^4.0.1",
"@angular/core": "^4.0.1",
"@angular/flex-layout": "^2.0.0-beta.7",
"@angular/forms": "^4.0.1",
"@angular/http": "^4.0.1",
"@angular/material": "^2.0.0-beta.3",
"@angular/platform-browser": "^4.0.1",
"@angular/platform-browser-dynamic": "^4.0.1",
"@angular/router": "^4.0.1",
"@swimlane/ngx-datatable": "^7.1.0",
"core-js": "^2.4.1",
"font-awesome": "^4.7.0",
"ng2-cookies": "^1.0.11",
"primeng": "^4.0.0-rc.1",
"rxjs": "^5.1.0",
"zone.js": "0.8.4"
},
"devDependencies": {
"@angular/cli": "1.0.0",
"@angular/compiler-cli": "^4.0.1",
"@types/jasmine": "2.5.38",
"@types/node": "~6.0.60",
"codelyzer": "~2.0.0",
"jasmine": "^2.5.3",
"jasmine-core": "~2.5.2",
"jasmine-spec-reporter": "~3.2.0",
"karma": "^1.4.1",
"karma-chrome-launcher": "~2.0.0",
"karma-cli": "~1.0.1",
"karma-coverage-istanbul-reporter": "^0.2.0",
"karma-jasmine": "~1.1.0",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "~5.1.0",
"protractor-browser-logs": "^1.0.350",
"ts-node": "~2.0.0",
"tslint": "~4.5.0",
"typescript": "~2.2.2"
}

[gtzinos]

Guys i updated my packages and i changed my imports in app.module.ts

I remove FlexLayoutModule.forRoot() and i replaced it with FlexLayoutModule.

Now gt works again.

[Abbraxar]

Just want to say for newcomers that all lt-* are still not working / exist in beta 8.

[gtzinos]

It is a feature.

[DavidTheProgrammer]

They should probably fix that. I've been struggling with this for too long. Only to find it's not wrong code but a broken feature

[ThomasBurleson]

@gtzinos - fxHide + fxHide.lt-md works as expected. See http://plnkr.co/edit/MGNi2iJOrERASTDuEhHS?p=preview

Note: this is using latest code from flex-layout-builds/HEAD. This should be available on NPM in Beta.9... after 6/22/2017.

[ThomasBurleson]

Closing as no-longer-an-issue.

[Splaktar]

@Juliozen I have seen a number of people report problems when using ^2.0.0-beta.10. Are you sure that 2.0.0-beta.10 is getting installed? Some users have reported that it actually installs one of the older RCs. Using 2.0.0-beta.10 in your package.json (without the caret) may help.

[AndrinGautschi]

@Juliozen Clean your npm cache, reinstall and check in the node_modules/@angular/flex-layout/package.json the resolved version. If the problem continuous, your version may be overridden by a third party library. Try to figure out with npm list. If this is the case, add a "resolutions": {"packagename": "version"} to your package.json.

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{_This action has been performed automatically by a bot._}