Closed fredbi closed 6 years ago
It was working. In the meanwhile all Angular related versions werde changed and users reports this issue time to time. I have to investigate more time to solve it. I will keep you informed.
Hello. Thank you for your prompt answer.
I don't think it is related to your code, but rather to the npm packaging vs @angular/cli
.
I've had similar issues (e.g. the infamous "xxx in not an NgModule") on packages working fine when using source directly and no more working when using their npm package.
Upgraded to @angular/cli@1.4.9
with no more success.
It seems to be an issue with Angular CLI if you use Wizard with Angular CLI in AOT mode. See similar issues:
https://github.com/angular/angular-cli/issues/3707 https://github.com/angular/angular-cli/issues/4647 https://github.com/angular/angular-cli/issues/3854
I have never tried Wizard with Angular CLI. The Wizard component was just a demonstration of custom component. Sorry, but I assume I can not fix this issue. I only use arrow functions in forEach like this
this.steps.toArray().forEach((step: StepComponent, index: number) => {
// show / hide the step
let selected = index === curIndex;
step.active = selected;
if (selected) {
// emit currently selected label
this.change.next(step.label);
}
});
Theoretically I can switch to normal functions, but it's not worth for the book. The Wizard component is not for production, it is only for demonstration purpose.
Thanks anyway. I'll check it further out but I don't think I am building with IOT : angular CLI defaults to JIT build when building with --dev target. I admit the 'wontfix' decision is probably the correct one. Frustrating, though...
@fredbi Well, I will try to include the Wizard into a fresh created project with Angular CLI when I have more time.
Hello. Your book is most useful. Great work! Eventually I decided to try and use your wizard. Got the following build error when attempting to bind the WizardModule class in my main app.
ERROR in Error: Error encountered resolving symbol values statically. Function calls are not supported. Consider replacing the function or lambda with a reference to an exported function (position 194:50 in the original .ts file), resolving symbol NgModule in /var/disk2/thefundschain/poc.1.0.2/src/dltshift.com/thefundschain/clients/www/issuerApps/node_modules/primeng-extensions-wizard/node_modules/@angular/core/core.d.ts, resolving symbol WizardModule in /var/disk2/thefundschain/poc.1.0.2/src/dltshift.com/thefundschain/clients/www/issuerApps/node_modules/primeng-extensions-wizard/components/wizard.module.d.ts, resolving symbol WizardModule in /var/disk2/thefundschain/poc.1.0.2/src/dltshift.com/thefundschain/clients/www/issuerApps/node_modules/primeng-extensions-wizard/components/wizard.module.d.ts at positionalError (/var/disk2/thefundschain/poc.1.0.2/src/dltshift.com/thefundschain/clients/www/issuerApps/node_modules/@angular/compiler/bundles/compiler.umd.js:25134:35) at simplifyInContext (/var/disk2/thefundschain/poc.1.0.2/src/dltshift.com/thefundschain/clients/www/issuerApps/node_modules/@angular/compiler/bundles/compiler.umd.js:24977:27) at StaticReflector.simplify (/var/disk2/thefundschain/poc.1.0.2/src/dltshift.com/thefundschain/clients/www/issuerApps/node_modules/@angular/compiler/bundles/compiler.umd.js:24991:13) at StaticReflector.annotations (/var/disk2/thefundschain/poc.1.0.2/src/dltshift.com/thefundschain/clients/www/issuerApps/node_modules/@angular/compiler/bundles/compiler.umd.js:24418:41) at _getNgModuleMetadata (/var/disk2/thefundschain/poc.1.0.2/src/dltshift.com/thefundschain/clients/www/issuerApps/node_modules/@angular/compiler-cli/src/ngtools_impl.js:138:31) at _extractLazyRoutesFromStaticModule (/var/disk2/thefundschain/poc.1.0.2/src/dltshift.com/thefundschain/clients/www/issuerApps/node_modules/@angular/compiler-cli/src/ngtools_impl.js:109:26) at /var/disk2/thefundschain/poc.1.0.2/src/dltshift.com/thefundschain/clients/www/issuerApps/node_modules/@angular/compiler-cli/src/ngtools_impl.js:129:27 at Array.reduce (native) at _extractLazyRoutesFromStaticModule (/var/disk2/thefundschain/poc.1.0.2/src/dltshift.com/thefundschain/clients/www/issuerApps/node_modules/@angular/compiler-cli/src/ngtools_impl.js:128:10) at Object.listLazyRoutesOfModule (/var/disk2/thefundschain/poc.1.0.2/src/dltshift.com/thefundschain/clients/www/issuerApps/node_modules/@angular/compiler-cli/src/ngtools_impl.js:53:22) at Function.NgTools_InternalApi_NG_2.listLazyRoutes (/var/disk2/thefundschain/poc.1.0.2/src/dltshift.com/thefundschain/clients/www/issuerApps/node_modules/@angular/compiler-cli/src/ngtools_api.js:91:39) at AotPlugin._getLazyRoutesFromNgtools (/var/disk2/thefundschain/poc.1.0.2/src/dltshift.com/thefundschain/clients/www/issuerApps/node_modules/@ngtools/webpack/src/plugin.js:207:44) at _donePromise.Promise.resolve.then.then.then.then.then (/var/disk2/thefundschain/poc.1.0.2/src/dltshift.com/thefundschain/clients/www/issuerApps/node_modules/@ngtools/webpack/src/plugin.js:443:24)
in:
app.module.ts
, I declared the following:` // Prime NG components (primeng/primeng imports all components) import { ButtonModule } from 'primeng/components/button/button'; ... import { TreeTableModule } from 'primeng/components/treetable/treetable';
// PrimeNG contributions import { WizardModule } from 'primeng-extensions-wizard/components/wizard.module'; `
I use np.m package rel. 2.1.0. Excerpt from my saved package.json dependencies:
"dependencies": { "@angular/animations": "^4.4.6", "@angular/common": "^4.2.4", "@angular/compiler": "^4.2.4", "@angular/compiler-cli": "^4.4.6", "@angular/core": "^4.2.4", "@angular/forms": "^4.2.4", "@angular/http": "^4.2.4", "@angular/platform-browser": "^4.2.4", "@angular/platform-browser-dynamic": "^4.2.4", "@angular/platform-server": "^4.4.6", "@angular/router": "^4.2.4", "@ng-bootstrap/ng-bootstrap": "^1.0.0-beta.5", "core-js": "^2.4.1", "font-awesome": "^4.7.0", "primeng": "^4.2.2", "primeng-extensions-wizard": "^2.1.0", "rxjs": "^5.4.2", "zone.js": "^0.8.14" },
OS: Linux UBUNTU 14.04 x64 angular/cli: 1.4.4 node: 6.11.3 typescript: 2.3.4
The import line by itself does nothing. This is the one which triggers the build error. When I remove the reference from @NgModule( imports: []), the build returns to ok.
@NgModule({ // Components used in this page // @todo: investors should move to the distributor's apps suite declarations: [ AppComponent, ... ], imports: [ BrowserModule, BrowserAnimationsModule, FormsModule, HttpModule, // PrimeNG modules ButtonModule, ... TreeTableModule, **WizardModule,** // Routes accessible from main landing pages routes ],