Cannot read property "display" of undefined when updating from rc.1 to beta-6.

[Pypoli]

Hi, I'm getting the error: Cannot read property "display" of undefined when updating from rc.1 to beta-6. at _GetDisplayStyle() The app runs fine when i simply run it, and compiles fine, however the compiled version gives me the above error. My package.json:

"dependencies": {
    "@angular/animations": "^4.2.0",
    "@angular/common": "^4.2.0",
    "@angular/compiler": "^4.2.0",
    "@angular/compiler-cli": "^4.2.0",
    "@angular/core": "^4.2.0",
    "@angular/flex-layout": "2.0.0-rc.1",
    "@angular/forms": "^4.2.0",
    "@angular/http": "^4.2.0",
    "@angular/material": "^2.0.0-beta.6",
    "@angular/platform-browser": "^4.2.0",
    "@angular/platform-browser-dynamic": "^4.2.0",
    "@angular/platform-server": "^4.2.0",
    "@angular/router": "^4.2.0",
    "@covalent/core": "1.0.0-beta.5-1",
    "@ngrx/core": "^1.2.0",
    "@ngrx/store": "^2.2.2",
    "@types/node": "^6.0.73",
    "angular-in-memory-web-api": "~0.2.4",
    "angular-tree-component": "^3.7.2",
    "angular2-highcharts": "^0.5.5",
    "core-js": "^2.4.1",
    "hammerjs": "^2.0.8",
    "highcharts-exporting": "^0.1.2",
    "ng2-file-upload": "^1.2.1",
    "rxjs": "^5.2.0",
    "ts-helpers": "^1.1.1",
    "typescript": "~2.2.0",
    "zone.js": "^0.8.10"
  },
  "devDependencies": {
    "@angular/cli": "^1.0.6",
    "@types/jasmine": "2.5.38",
    "codelyzer": "~2.0.0",
    "jasmine-core": "^2.5.2",
    "jasmine-spec-reporter": "~3.2.0",
    "karma": "~1.4.1",
    "karma-chrome-launcher": "~2.1.1",
    "karma-cli": "~1.0.1",
    "karma-coverage-istanbul-reporter": "^0.3.0",
    "karma-jasmine": "~1.1.0",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.1.0",
    "sass-loader": "4.1.0",
    "ts-node": "~2.0.0",
    "tslint": "^4.4.2"
  },
  "main": "index.js"

This works just fine, however if I try to change it from rc-1 to beta-6 (or beta-8, I've tried both), then the compiled app gives returns a javascript error.

[ThomasBurleson]

"@angular/flex-layout": "2.0.0-rc.1", was deprecated to Beta.7

Please do this:

npm uninstall @angular/flex-layout
npm install @angular/flex-layout --save

This should install Beta.8 for you and your errors should be resolved.

[Pypoli]

I'm sorry if this wasn't clear in my original post, when I use flex-layout-rc.1 it DOES work. If I try to update to beta.7 or beta.8, then I get the error above.

[ThomasBurleson]

Please try using the latest build version from HEAD. Use command line:

npm i github:angular/flex-layout-builds --save

This has been reported in #300 and fixed with PR #301

[Pypoli]

I've tried what you suggested. Here's my package.json: "dependencies": { "@angular/animations": "^4.2.0", "@angular/common": "^4.2.0", "@angular/compiler": "^4.2.0", "@angular/compiler-cli": "^4.2.0", "@angular/core": "^4.2.0", "@angular/flex-layout": "github:angular/flex-layout-builds", "@angular/forms": "^4.2.0", "@angular/http": "^4.2.0", "@angular/material": "^2.0.0-beta.6", "@angular/platform-browser": "^4.2.0", "@angular/platform-browser-dynamic": "^4.2.0", "@angular/platform-server": "^4.2.0", "@angular/router": "^4.2.0", "@covalent/core": "1.0.0-beta.5-1", "@ngrx/core": "^1.2.0", "@ngrx/store": "^2.2.2", "@ngrx/store-devtools": "^3.2.4", "@types/node": "^6.0.73", "angular-in-memory-web-api": "~0.2.4", "angular-tree-component": "^3.7.2", "angular2-highcharts": "^0.5.5", "core-js": "^2.4.1", "hammerjs": "^2.0.8", "highcharts-exporting": "^0.1.2", "ng2-file-upload": "^1.2.1", "rxjs": "^5.2.0", "ts-helpers": "^1.1.1", "typescript": "~2.2.0", "zone.js": "^0.8.10" }, "devDependencies": { "@angular/cli": "^1.0.6", "@types/jasmine": "2.5.38", "codelyzer": "~2.0.0", "jasmine-core": "^2.5.2", "jasmine-spec-reporter": "~3.2.0", "karma": "~1.4.1", "karma-chrome-launcher": "~2.1.1", "karma-cli": "~1.0.1", "karma-coverage-istanbul-reporter": "^0.3.0", "karma-jasmine": "~1.1.0", "karma-jasmine-html-reporter": "^0.2.2", "ngrx-store-freeze": "^0.1.9", "protractor": "~5.1.0", "sass-loader": "4.1.0", "ts-node": "~2.0.0", "tslint": "^4.4.2" }, "main": "index.js"

And here's the error:

[ThomasBurleson]

@Pypoli - can you provide a plunkr that reproduces this error: Plunkr Template

[ronnyek]

I too am encountering this. I've got a dialog that pops up and renders some dynamic form inputs. I iterate the form inputs via:

<ng-container *ngFor=....>
</ng-container>

this code apparently trys to gather style information, but because its a structural directive, and renderes the ngfor as comments, it grenades.

It would seem as if this is valid use case, code works without flex-layout being included in the page. I can change ng-container to an actual html type (which then renders instead of the comments, and code begins to work after that)

[ronnyek]

As a side note, I attempted to fork the plunkr and build a reproduction... however seems like comments / *ngfor on a ng-container isnt breaking there. I attempted to install with the npm i github:angular/flex-layout-builds --save

But it just appears to install the beta .8 which still has that issue.

[ThomasBurleson]

@ronnyek - Thx. We are investigating.

[ThomasBurleson]

@ronnyek - without a Plunkr demonstrating the issue (with the latest build, we cannot confirm that this issue is valid.

Closing until a demo is provided.

[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.}