Forums Home / Wijmo / General Discussion
Posted by: c1_alexi on 14 September 2017, 11:44 am EST
c1_alexi
Posted 14 September 2017, 11:44 am EST
Hello
This finally happened, Angular 2 team announced the final release!!! :
http://angularjs.blogspot.ru/2016/09/angular2-final.html
Our congratulations to Angular 2 team and to all Angular 2 users!
We have an official release build that includes support for Angular 2 Release version.
Evaluation version: http://wijmo.com/download/
Licensed versions are available to current customers here: https://wijmo.com/my-account/
Thanks,
Alex
rogin
Posted 14 September 2017, 11:44 am EST
Dear Alex,
It’s not possible to download the last licensed or evaluation version of Wijmo 5 for Angular 2 from the website.
Thanks.
nileshgokhale45
Posted 14 September 2017, 11:44 am EST
I downloaded the zip from the link you specified. I do not understand how to use it? I cannot find any angular 2 release version apps in the samples.
Am I missing something?
c1_alexi
Posted 14 September 2017, 11:44 am EST
Hello
We had a problem with download links on our site (both public and licensed). Please re-download it again, it should be Wijmo version 211.
Sorry for the inconvenience.
Thanks,
Alex
nileshgokhale45
Posted 14 September 2017, 11:44 am EST
Thank You, I am able to see the correct samples now.
jason-goemaat
Posted 14 September 2017, 11:44 am EST
Need to get it working with ahead-of-time compiling to be useful. Right now I get an error trying to use it. If you can ever get it working with the angular cli with ‘ng build --prod --aot’ I would consider buying. Making an npm module would be awesome, even one you could just include in your project and install as a node module from a local directory or in a private repository somewhere would be great.
It should be as simple as “npm install <dir>” and import the WjInputModule into your project, right? Only way I was even able to get a sample working was to copy certain .min.js files and remove the .min, then put in node_modules/wijmo. Doesn’t work with AOT though.
c1_alexi
Posted 14 September 2017, 11:44 am EST
Hello Jason
Thanks for your feedback. Regarding
npm install <dir>Regarding AoT compiler support, this is what we are working on now. The plan is to include it in the nearest release as well, but it’s not absolutely clear now whether we’ll manage to fit in time with this. Hope we’ll have it there too.
Thanks,
Alex
steve-emmons
Posted 14 September 2017, 11:44 am EST
Angular2 i18n (with XLIFF and ng-xi18n extraction tool) support is something we need urgently. I’ve read your article on the Webpack bundler and was able to manage Wijmo libs incorporated with Webpack (Thanks). Now the last huddle to go through is i18n support and I’m having an issue with Wijmo modules. When I run ng-xi18n extraction tool, I get an error like this:
Error: Unexpected value ‘WjCoreModule’ imported by the module ‘AppModule’
at /…/ngapp/node_modules/@angular/compiler/bundles/compiler.umd.js:14078:37
The error is coming from the following construct, I believe:
// import {WjCoreModule} from “wijmo/wijmo.angular2.core”;
import * as wjCore from “wijmo/wijmo.angular2.core”; // I tried this variation as well
import {WjGridModule} from “wijmo/wijmo.angular2.grid”;
import {WjInputModule} from “wijmo/wijmo.angular2.input”;
@NgModule( {
imports: [ BrowserModule, FormsModule, HttpModule, wjCore.WjCoreModule, WjInputModule, WjGridModule ],
Some research on the web seems to suggest that the vendor modules are expected to supply *.metadata.json which angular/compiler-cli looks for. When I look at angular packages under nodemodules directory, I see these metadata.json files, but not so in wijmo modules (I got these modules from *.222 version posted in your bundler article). I would definitely try AOT up next and hopefully it is ready soon, and I believe the ng-xi18n issue is related to AOT. Any workaround to get those metadata.json files ASAP? If the issue is more than these metadata files, what can I do to get the XLIFF extraction tool to work?
Additionally how can I pass along Angular2 i18n settings to Wijmo libs localization context? I implemented locale service loader with Webpack in the application bootstrap process fine, but that works only for Angular2 libs (not for Wijmo libs), I assume.
c1_alexi
Posted 14 September 2017, 11:44 am EST
Hello
Thanks for your feedback. Let me explain the situation.
Regarding AoT compiler, Wijmo doesn’t support it currently, and we are working on adding this support right now.
Regarding Ng2 i18n, if you mean localization of Wijmo embedded UI strings (that can be found in components like FlexGridFilter or Olap), I think this workflow is not applicable there, because what it does is a localization of Ng2 templates.
Wijmo controls localization is implemented using culture files shipped with the library, for more than 40 different cultures. The localization covers controls’ UI strings and number/date/time/calendar formatting rules.
I attached a WebPack based Ng2 sample that demonstrates how to apply cultures in two different scenarios:
Please refer to the webpack_readme.txt file included in the sample for the detailed explanation.
Thanks,
Alex
2016/10/FlexGridFilter_Cultures_Themes_WP.zip
steve-emmons
Posted 14 September 2017, 11:44 am EST
Hi Alex,
Thanks for the reply, but I’m not sure if you are understanding the issue correctly. I will restate my problem with an example. First start with the Angular2 Quick Start program (from angular.io). Then apply Webpack intro tutorial to it (from angular.io). Now apply i18n cookbook exercise (again from angular.io). The app comes up fine and I can do XLIFF extraction just fine with the command ‘./nodemodules/.bin/ng-xi18n’ as noted in the i18n cookbook. This command generates messages.xlf file as expected. Now I add Wijmo flavor to it as follows:
===== my app.module.ts file =====
import { NgModule } from ‘@angular/core’;
import { BrowserModule } from ‘@angular/platform-browser’;
import { WjInputModule } from “wijmo/wijmo.angular2.input”;
import { AppComponent } from ‘./app.component’;
@NgModule({
// imports: [ BrowserModule, WjInputModule ], // <== ng-xi18n error once WjInputModule is added
imports: [ BrowserModule ],
declarations: [ AppComponent ],
bootstrap: [ AppComponent ]
})
export class AppModule { }
===== my app.module.ts file (end) =====
As annotated above, once I add an Wijmo module reference to it, ‘ng-xi18n’ extraction tool errors out, and therefore, I cannot generate ‘messages.xlf’ file.
The error message is like this:
Error: Unexpected value ‘WjInputModule’ imported by the module ‘AppModule’
at /Users/bjjeong/dev/projects/i18n-qs/node_modules/@angular/compiler/bundles/compiler.umd.js:14078:37
…
Extraction failed
Note that the Wijmo control is rendered correctly and the application itself runs with no error, but I cannot simply use the extraction tool which prevents me from implementing i18n solution for our product. Flipping between two import statements above can easily demonstrate the issue, and I can provide the sample app I tried out if you like (Angular2 starter app + Webpack tutorial + i18n tutorial + Wijmo Number control). I think there is a simple solution as hinted in my earlier post with the metadata.json file inclusion in the Wijmo lib distribution.
I have a hunch that ‘ng-xi18n’ may fail even without webpack applied once Wijmo modules are referenced (In fact, the control does not even have to be used). Since you guys are about to release *.222 soon, I’m hoping it is released with ‘ng-xi18n’ extraction tool support.
By the way, attached zip file “FlexGridFilter_Cultures_Themes_WP.zip” errors out with an error to the effect ‘not able to read source file’. Thanks.
c1_alexi
Posted 14 September 2017, 11:44 am EST
Hello
I see. We can’t provide .metadata.json files until we add support for AoT compiler, we are working on it now.
Regarding the sample I provided, I tried to download if from here, unzip and build/run, and didn’t meet any problem. Maybe zip was just corrupted while you downloaded it?
Thanks,
Alex
steve-emmons
Posted 14 September 2017, 11:44 am EST
Hi Alex,
I’m trying out WebPack build With the new release 20163.234, and I’m having a build issue like this:
ERROR in [default] /…/node_modules/wijmo/wijmo.chart.animation.ts:2365:19
Type ‘Timer’ is not assignable to type ‘number’.
ERROR in [default] /…/node_modules/wijmo/wijmo.grid.detail.ts:376:16
Type ‘Timer’ is not assignable to type ‘number’.
There are a dozen of them like this coming from different Wijmo sources. Apparently setTimeout() and setInterval globally defined methods have conflicting function signatures between lib.d.ts and Node index.ts:
declare function setInterval(handler: (…args: any) => void, timeout: number): number;
declare function setInterval(handler: any, timeout?: any, …args: any): number;
declare function setTimeout(handler: (…args: any) => void, timeout: number): number;
declare function setTimeout(handler: any, timeout?: any, …args: any): number;
declare function setTimeout(callback: (…args: any) => void, ms: number, …args: any): NodeJS.Timer;
declare function setInterval(callback: (…args: any) => void, ms: number, …args: any): NodeJS.Timer;
You see the return types are different between two, number vs. NodeJS.Timer. Wijmo libs uses these methods as index.d.ts apparently, but incorrectly node version is getting referenced, so the errors. In the earlier release of 2.x, I did not have an issue as such. If I comment out Node version of setTimeout/setInterval, then the build is fine. Clearly Wijmo libs are referencing wrong type definitions. I cannot simply remove Node dependency because WebPack build will need Node to do its job (like ‘require’). Any ideas? Thanks.
steve-emmons
Posted 14 September 2017, 11:44 am EST
On the WebPack build issue with 20163.234, a work around is to include an ambient import at the root of the app to force the resolution of setTimeout/setInterval to Window versions.
Create a file like “fix.wijmo.ts” with the following two lines and add it to the wijmo package like ‘wijmo-amd-src’ folder.
declare function setInterval(handler: (…args: any) => void, timeout: number): number;
declare function setTimeout(handler: (…args: any) => void, timeout: number): number;
Then import the module above in the main entry like main.ts (wijmo npm module is available in node_modules/wijmo either by file mode or intranet registry like NPME):
import ‘wijmo/fix.wijmo’;
We’re going with this solution for now until we know better. Thanks.
ccruzmx
Posted 14 September 2017, 11:44 am EST
Still having the issue with the @types/node double reference for the Timer stuff.
import ‘./wijmo.fix’; is not working as it should It seems the tsc is compiling the wijmo stoo before my main.ts will be compiled.
Im adding all that to my wijmo.fix.ts:
`declare function setInterval(handler: (…args: any) => void, timeout: number): number;
declare function setTimeout(handler: (…args: any) => void, timeout: number): number;
declare function setTimeout(callback: (…args: any) => void, ms: number, …args: any): number;
declare function clearTimeout(timeoutId: number): void;
declare function setInterval(callback: (…args: any) => void, ms: number, …args: any): number;
declare function clearInterval(intervalId: number): void;
declare function setImmediate(callback: (…args: any) => void, …args: any): any;
declare function clearImmediate(immediateId: any): void;’
AAl-ismail
Posted 23 April 2019, 9:03 am EST
Hi,
Even am facing similar issue from past 4 days and in bad need of help.Kindly suggest a solution here.
ERROR in : Unexpected value ‘WjInputModule in /work/cfs-gui-agent2/1/s/node_modules/wijmo/ts3.1.1/wijmo.angular2.input.d.ts’ imported by the module ‘xxxModule in /work/cfs-gui-agent2/1/s/node_modules/xxxxx.d.ts’. Please add a @NgModule annotation.
Recent incorporation was we have upgraded to Angular-7.1.4 and ng-packagr:4.4.5
