These are chat archives for angular/angular-2-ionic-2

10th
Jan 2018
texirv0203
@texirv0203
Jan 10 2018 15:14

hi,


@NgModule({
  imports: [
    BrowserModule,
    AppRoutingModule,
  • I am getting below three errors...
  • can you tell me how to fix it.
  • providing my code snippet in the gist since the code is big

VM17569:34 Unhandled Promise rejection: Bootstrap at least one component before injecting Router. ; Zone: <root> ; Task: Promise.then ; Value: Error: Bootstrap at least one component before injecting Router.
VM17569:34 Error: Uncaught (in promise): Error: Bootstrap at least one component before injecting Router.
Uncaught TypeError: Converting circular structure to JSON

app.routing.ts
https://gist.github.com/texirv0203/aed7ecb44fa37653d7d5e464ce236047

app.module.ts

https://gist.github.com/texirv0203/e27d8bba83d8773e84ea21855a969601

app.component.ts

https://gist.github.com/texirv0203/5a49f608d107003dc8fd73f1650bed60

Relevant code


export class AppRoutingModule {

   vpView: any;

//   // Subscribe to the Router URL changes.
    //@Inject(Service, 'some-token')
  constructor(public appRoutes:Router) {
      console.log("appDyanmics-sample-constructor");
      this.appRoutes.events.subscribe((event:Event) => {
              if (event instanceof NavigationEnd) {
                console.debug('NavigationEnd: '+event.url);

                this.vpView.markViewChangeEnd();
                this.vpView.markViewDOMLoaded();
                this.vpView.markXhrRequestsCompleted();
                this.vpView.markViewResourcesLoaded();
                this.vpView.end();
                ADRUM.Sky(this.vpView);

              } else if (event instanceof NavigationStart) {
                console.debug('NavigationStart: '+event.url);

                this.vpView = new ADRUM.events.VPageView();
                this.vpView.start();
                this.vpView.markViewChangeStart();
              } else {
                  console.log("error here");
              }
          });
  }
}
KRich025
@KRich025
Jan 10 2018 15:41
Does anyone know how to integrate Pusher with Ionic/Angular2+? I can't figure it out
texirv0203
@texirv0203
Jan 10 2018 16:14
hi,
do you guys know any open source end user web tracking tool
texirv0203
@texirv0203
Jan 10 2018 19:23

hi,
how to pass the custom event in the payload for appdyanmics.
I am using the below example

https://github.com/derrekyoung/appd-sampleapp-angular2

Dale
@daleholborow
Jan 10 2018 20:35
what do you mean web tracking
something like rollbar?> or to track users around the internet? or something like hotjar that tracks clicks on your pages?
texirv0203
@texirv0203
Jan 10 2018 23:30

hi,

  • I am using appdyanmics in my app for monitoring user activity.
  • but the problem is it doesnt show how much time user has clicked the button.
  • so using rxjs I have wrote a click event.
  • this click event shows the mouse event and how to pass this mouse event in appdyanmics payload, so that I can generate a report usimg appdyanmics.
  • providing my code changes below

appdyanmics Reference links:

https://docs.appdynamics.com/display/PRO42/Extend+the+JavaScript+Agent+for+Single+Page+Applications+%28SPAs%29+in+Browser+RUM
https://docs.appdynamics.com/display/PRO42/Single+Page+Applications+in+Browser+RUM+-+AngularJS

sample appdynamics angular app https://github.com/derrekyoung/appd-sampleapp-angular2

<script src="https://cdn.appdynamics.com/adrum/adrum-latest.js"></script>

app.component.ts


import { Component } from '@angular/core';
import {Subject} from 'rxjs/Subject';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'AppDynamics Sample App for Angular 2';

    click = new Subject();

    ngOnInit() {
      this.click.subscribe(console.log);
    }


}

app.component.html


<h1>
  {{title}}
</h1>

<header>
  <div>

    <!-- Navigation with router directives-->
    <nav>
      <a [routerLink]="['/']">Home</a>
      <a [routerLink]="['/names']">Names</a>
      <a [routerLink]="['/posts']">Posts</a>
      <a [routerLink]="['/photos']">Photos</a>
    </nav>
  </div>
  <div>
    <!-- <button (click)="new Subject()" type="button">Click Me!</button> -->

    <button (click)="click.next($event)">Click Me!</button> 
  </div>

</header>


<router-outlet></router-outlet>

appdynamics request payload


{
  "vr": "4.4.1.154",
  "dt": "R",
  "rg": "0",
  "es": [{
    "eg": "1",
    "et": 2,
    "eu": "0://1/2/",
    "ts": 1515610064377,
    "mg": "2",
    "au": "0://3/",
    "at": 3,
    "pp": 3,
    "mx": {
      "PLC": 1,
      "FBT": 48,
      "DDT": 0,
      "DPT": 4,
      "PLT": 52,
      "ARE": 0
    },
    "md": "GET",
    "xs": 200,
    "si": 18
  }],
  "ai": "d4e7ef50_b4f3_1dd7_5cdf_49a60ff5635d",
  "gs": ["bbe438d0_0c94_63d9_2c22_700343b560b5", "cde9c933_e332_41ce_9333_5021c1502265", "4e6a7f03_4588_49e2_6c25_d8a3a1f3fe90"],
  "up": ["http", "jsonplaceholder.typicode.com", "users", "localhost:4200"]
}