This topic contains 13 replies, has 6 voices, and was last updated by  m.miertschink 6 months, 1 week ago.

Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • #79028

    Alex Ivanenko
    Moderator

    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

    • This topic was modified 10 months, 1 week ago by  Chris Bannon.
    • This topic was modified 10 months ago by  Chris Bannon.
    #79861

    cjimenez
    Member

    Wijmo Subscriber

    Dear Alex,

    It’s not possible to download the last licensed or evaluation version of Wijmo 5 for Angular 2 from the website.

    Thanks.

    #79896

    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?

    #79898

    Alex Ivanenko
    Moderator

    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

    #79900

    Thank You, I am able to see the correct samples now.

    #80283

    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.

    #80310

    Alex Ivanenko
    Moderator

    Hello Jason

    Thanks for your feedback. Regarding npm install <dir>, yes, this will be supported in the upcoming release. Prerelease builds already include this functionality, along with true (external) module versions for Wijmo core modules.

    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

    #80469

    bjjeong
    Member

    Wijmo Subscriber

    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.

    #80502

    Alex Ivanenko
    Moderator

    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:
    1) Statically, by including a culture in app bundle.
    2) Dynamically on demand, where a culture is loaded from an external file at an arbitrary moment of time.

    Please refer to the webpack_readme.txt file included in the sample for the detailed explanation.

    Thanks,
    Alex

    #80515

    bjjeong
    Member

    Wijmo Subscriber

    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.

    • This reply was modified 8 months, 4 weeks ago by  bjjeong. Reason: error message too verbose
    #80568

    Alex Ivanenko
    Moderator

    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

    #81749

    bjjeong
    Member

    Wijmo Subscriber

    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:

    lib.d.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;

    Node index.d.ts
    —————
    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.

    #81867

    bjjeong
    Member

    Wijmo Subscriber

    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.

    #83464

    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;’

    • This reply was modified 6 months, 1 week ago by  m.miertschink.
Viewing 14 posts - 1 through 14 (of 14 total)

You must be logged in to reply to this topic.