Developer Portal Community

    cancel
    Showing results for 
    Search instead for 
    Did you mean: 
    SOLVED

    COBI.Bike integration with Angular

    divid3byzero
    Member

    Re: COBI.Bike integration with Angular

    Hello,

    thank you for your answer.

    Is there any news concerning the Angular issue? That is a show stopper for my development so I would be very glad if you could look into that.

    Regards

    dfarache-ebike
    Community Moderator

    Re: COBI.Bike integration with Angular

    Hello,

    could you point to a Github repository so that we could have a look?

    Below you have a snippet of the main.ts, which is working with our SDK. Our suggestions would be trying the following:

    • importing platform-browser-dynamic
    • configuring a platformBrowserDynamic bootstrapping of the application

    If you could let us check the source code, we would be more than happy to help you troubleshoot this issue.

    import { enableProdMode } from '@angular/core';
    import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
    import { AppModule } from './app/app.module';
    import { environment } from './environments/environment';
    
    if (environment.production) {
      enableProdMode();
    }
    
    platformBrowserDynamic()
      .bootstrapModule(AppModule)
      .catch(err => console.log(err));
    
    // Authenticate your module
    COBI.init('token — can be anything right now');

     

    divid3byzero
    Member

    Re: COBI.Bike integration with Angular

    Hello,

    I have already set up a Github repository and told you about it in my answer about month ago: https://community.developer.bosch.com/t5/COBI-Bike-SDK/COBI-Bike-integration-with-Angular/m-p/12768/...

    Here is the link again: https://github.com/divid3byzero/ng-cobi-demo

     

    dfarache-ebike
    Community Moderator

    Re: COBI.Bike integration with Angular

    Hello,

    Sorry for the dely in the reply.

    I cloned your repository and run it. Indeed, the COBI SDK complains about a subscription taking place before init is executed.

    Playing around with it, I discovered that removing the setTimeout in the component fixes the issue. I was able to print to console the speed stream,

    Regards,

    divid3byzero
    Member

    Re: COBI.Bike integration with Angular

    Hello,

    I've removed the setTimeout function as suggested. I'm initilizing Cobi using an Angular app initializer.

    It still does not update the data in the UI with the data from the stream. I've added a button to trigger the Cobi data stream subscribtion and added some basic logging. As you can see the data stream is being written from the Cobi SDK but the UI is not being updated. You can see for yourself: https://github.com/divid3byzero/ng-cobi-demo.

    Here is the link to a screen capture: https://vimeo.com/444666788

    Regards
    Bene

    Icon--AD-black-48x48Icon--address-consumer-data-black-48x48Icon--appointment-black-48x48Icon--back-left-black-48x48Icon--calendar-black-48x48Icon--center-alignedIcon--Checkbox-checkIcon--clock-black-48x48Icon--close-black-48x48Icon--compare-black-48x48Icon--confirmation-black-48x48Icon--dealer-details-black-48x48Icon--delete-black-48x48Icon--delivery-black-48x48Icon--down-black-48x48Icon--download-black-48x48Ic-OverlayAlertIcon--externallink-black-48x48Icon-Filledforward-right_adjustedIcon--grid-view-black-48x48IC_gd_Check-Circle170821_Icons_Community170823_Bosch_Icons170823_Bosch_Icons170821_Icons_CommunityIC-logout170821_Icons_Community170825_Bosch_Icons170821_Icons_CommunityIC-shopping-cart2170821_Icons_CommunityIC-upIC_UserIcon--imageIcon--info-i-black-48x48Icon--left-alignedIcon--Less-minimize-black-48x48Icon-FilledIcon--List-Check-grennIcon--List-Check-blackIcon--List-Cross-blackIcon--list-view-mobile-black-48x48Icon--list-view-black-48x48Icon--More-Maximize-black-48x48Icon--my-product-black-48x48Icon--newsletter-black-48x48Icon--payment-black-48x48Icon--print-black-48x48Icon--promotion-black-48x48Icon--registration-black-48x48Icon--Reset-black-48x48Icon--right-alignedshare-circle1Icon--share-black-48x48Icon--shopping-bag-black-48x48Icon-shopping-cartIcon--start-play-black-48x48Icon--store-locator-black-48x48Ic-OverlayAlertIcon--summary-black-48x48tumblrIcon-FilledvineIc-OverlayAlertwhishlist