ui-router / sample-app-angular Goto Github PK

What about adding some karma testcases / unit testcases? Also for demo purposes.

Kind regards,
Melroy

The live demo https://ui-router.github.io/sample-app-ng2/home
is not working.
I cloned the source code and serve from local. It's working fine.

ERROR in /var/www/sample-app-ng2/src/app/app.module.ts (23,28): Argument of type '{ states: ({ name: string; redirectTo: string; component: typeof AppComponent; } | { parent: stri...' is not assignable to parameter of type 'RootModule'.
Types of property 'config' are incompatible.
Type '(router: UIRouter) => void' is not assignable to type '(uiRouterInstance: UIRouter, injector: Injector, module: StatesModule) => any'.
Types of parameters 'router' and 'uiRouterInstance' are incompatible.
Type 'UIRouter' is not assignable to type 'UIRouter'. Two different types with this name exist, but they are unrelated.
Types of property 'locationService' are incompatible.
Type 'LocationServices' is not assignable to type 'LocationServices'. Two different types with this name exist, but they are unrelated.
Types of property 'dispose' are incompatible.
Type '(router?: UIRouter) => any' is not assignable to type '(router?: UIRouter) => any'. Two different types with this name exist, but they are unrelated.
Types of parameters 'router' and 'router' are incompatible.
Type 'UIRouter' is not assignable to type 'UIRouter'. Two different types with this name exist, but they are unrelated.
Types of property 'locationService' are incompatible.
Type 'LocationServices' is not assignable to type 'LocationServices'. Two different types with this name exist, but they are unrelated.
Types of property 'dispose' are incompatible.
Type '(router?: UIRouter) => any' is not assignable to type '(router?: UIRouter) => any'. Two different types with this name exist, but they are unrelated.
Types of parameters 'router' and 'router' are incompatible.
Type 'UIRouter' is not assignable to type 'UIRouter'. Two different types with this name exist, but they are unrelated.

Here are the errors I am getting:
ERROR in node_modules/@types/jasmine/index.d.ts(142,47): error TS1005: ';' expected.
node_modules/@types/jasmine/index.d.ts(142,90): error TS1005: '(' expected.
node_modules/@types/jasmine/index.d.ts(142,104): error TS1005: ']' expected.
node_modules/@types/jasmine/index.d.ts(142,112): error TS1005: ',' expected.
node_modules/@types/jasmine/index.d.ts(142,113): error TS1136: Property assignment expected.
node_modules/@types/jasmine/index.d.ts(142,121): error TS1005: ')' expected.
node_modules/@types/jasmine/index.d.ts(142,147): error TS1005: '(' expected.
node_modules/@types/jasmine/index.d.ts(142,162): error TS1005: ']' expected.
node_modules/@types/jasmine/index.d.ts(142,163): error TS1005: ',' expected.
node_modules/@types/jasmine/index.d.ts(142,164): error TS1136: Property assignment expected.
node_modules/@types/jasmine/index.d.ts(142,165): error TS1136: Property assignment expected.
node_modules/@types/jasmine/index.d.ts(142,179): error TS1005: ',' expected.
node_modules/@types/jasmine/index.d.ts(142,183): error TS1005: ':' expected.
node_modules/@types/jasmine/index.d.ts(142,208): error TS1005: '{' expected.
node_modules/@types/jasmine/index.d.ts(142,217): error TS1005: ':' expected.
node_modules/@types/jasmine/index.d.ts(142,222): error TS1005: ',' expected.
node_modules/@types/jasmine/index.d.ts(142,227): error TS1005: ':' expected.
node_modules/@types/jasmine/index.d.ts(142,228): error TS1109: Expression expected.
node_modules/@types/jasmine/index.d.ts(142,230): error TS1005: ')' expected.
node_modules/@types/jasmine/index.d.ts(635,30): error TS1005: ';' expected.
node_modules/@types/jasmine/index.d.ts(720,1): error TS1128: Declaration or statement expected.
node_modules/preact/dist/preact.d.ts(129,8): error TS1005: ';' expected.
node_modules/preact/dist/preact.d.ts(131,4): error TS1109: Expression expected.
node_modules/preact/dist/preact.d.ts(133,4): error TS1005: '(' expected.
node_modules/preact/dist/preact.d.ts(134,3): error TS1005: '(' expected.
node_modules/preact/dist/preact.d.ts(134,10): error TS1005: ')' expected.
node_modules/preact/dist/preact.d.ts(153,14): error TS1005: ';' expected.
node_modules/preact/dist/preact.d.ts(153,44): error TS1005: ';' expected.
node_modules/preact/dist/preact.d.ts(154,5): error TS1128: Declaration or statement expected.
node_modules/preact/dist/preact.d.ts(155,5): error TS1005: '(' expected.
node_modules/preact/dist/preact.d.ts(155,12): error TS1005: ')' expected.
node_modules/rxjs/internal/types.d.ts(81,44): error TS1005: ';' expected.
node_modules/rxjs/internal/types.d.ts(81,74): error TS1005: ';' expected.
node_modules/rxjs/internal/types.d.ts(81,77): error TS1109: Expression expected.

Please hrlp.

I am trying this UI-router and angular 5 . My issue is this . I want to have a resolved parent data that has to be updated by background job for every 1 minute . Also The parent data that is resolved has to automatically update the child data .

What is the point in creating modules for routing?
https://github.com/Ismaestro/angular4-example-app/blob/master/src/app/app-routing.module.ts

Can this do named views?

When I run npm install I am getting this:
Installing Cypress (version: 3.2.0)

× Downloading Cypress
→ Cypress Version: 3.2.0
Unzipping Cypress
Finishing Installation
The Cypress App could not be downloaded.

Please check network connectivity and try again:

URL: https://download.cypress.io/desktop/3.2.0?platform=win32&arch=x64
Error: connect ETIMEDOUT 104.25.215.23:443

Platform: win32 (10.0.16299)
Cypress Version: 3.2.0

Hi,

1. cloned sample-app-ng2
2. ng-serve complained about not finding message or folder types so I extracted them both into separate files
3. changed any references to include import { Folder } from './folder.interface';
   import { Message} from './message.interface';
4. app.module.ts. had to do a cast in the imports section. config: routerConfigFn
5. app compiles and serves with ng serve but fails with ng serve --aot
6. transitions not working, following is displayed in developer tools

Transition Rejection($id: 0 type: 6, message: The transition errored, detail: Error: No provider for StateService!)
Error
at injectionError (http://localhost:4200/vendor.bundle.js:2909:5) [angular]
at noProviderError (http://localhost:4200/vendor.bundle.js:2947:5) [angular]
at ReflectiveInjector_.prototype.throwOrNull (http://localhost:4200/vendor.bundle.js:4448:13) [angular]
at ReflectiveInjector.prototype.getByKeyDefault (http://localhost:4200/vendor.bundle.js:4487:13) [angular]
at ReflectiveInjector.prototype.getByKey (http://localhost:4200/vendor.bundle.js:4419:13) [angular]
at ReflectiveInjector.prototype.get (http://localhost:4200/vendor.bundle.js:4288:9) [angular]
at NgModuleInjector.prototype.get (http://localhost:4200/vendor.bundle.js:5256:9) [angular]
at resolveDep (http://localhost:4200/vendor.bundle.js:12717:5) [angular]
at createClass (http://localhost:4200/vendor.bundle.js:12581:17) [angular]
at createDirectiveInstance (http://localhost:4200/vendor.bundle.js:12401:5) [angular]
at createViewNodes (http://localhost:4200/vendor.bundle.js:13764:17) [angular]
at createRoot

This was working 11 days ago.

Thanks
Gary

Since Angular includes testing out of the box, seeing some of that configuration with ui-router would be nice. Testing future state components as an example.

ERROR in /node_modules/preact/dist/preact.d.ts (52,28): ',' expected.
/node_modules/preact/dist/preact.d.ts (53,28): ',' expected.
/node_modules/preact/dist/preact.d.ts (52,22): Cannot find name 'keyof'.
/node_modules/preact/dist/preact.d.ts (52,45): Cannot find name 'Pick'.
/node_modules/preact/dist/preact.d.ts (53,22): Cannot find name 'keyof'.
/node_modules/preact/dist/preact.d.ts (53,84): Cannot find name 'Pick'.
webpack: Failed to compile.

I am getting this error:

TypeError: Cannot read property 'createComponent' of undefined
at DialogService.confirm (app.js:63117)
at LandingPageComponent.uiCanExit (app.js:63026)
at app.js:43082
at invokeCallback (app.js:42261)
at TransitionHook.invokeHook (app.js:42273)
at app.js:42365
at processQueue (app.js:95791)
at app.js:95835
at Scope.$digest (app.js:96930)
at app.js:37014.

I am not sure if ViewContainerRef is being initialized properly or not.

🚨 You need to enable Continuous Integration on all branches of this repository. 🚨

To enable Greenkeeper, you need to make sure that a commit status is reported on all branches. This is required by Greenkeeper because it uses your CI build statuses to figure out when to notify you about breaking changes.

Since we didn’t receive a CI status on the greenkeeper/initial branch, it’s possible that you don’t have CI set up yet. We recommend using Travis CI, but Greenkeeper will work with every other CI service as well.

If you have already set up a CI for this repository, you might need to check how it’s configured. Make sure it is set to run on all new branches. If you don’t want it to run on absolutely every branch, you can whitelist branches starting with greenkeeper/.

Once you have installed and configured CI on this repository correctly, you’ll need to re-trigger Greenkeeper’s initial pull request. To do this, please delete the greenkeeper/initial branch in this repository, and then remove and re-add this repository to the Greenkeeper App’s white list on Github. You'll find this list on your repo or organization’s settings page, under Installed GitHub Apps.

When getting latest and running "npm start", I get this:

ERROR in node_modules/@types/jasmine/index.d.ts(142,47): error TS1005: ';' expected.
node_modules/@types/jasmine/index.d.ts(142,90): error TS1005: '(' expected.
node_modules/@types/jasmine/index.d.ts(142,104): error TS1005: ']' expected.
node_modules/@types/jasmine/index.d.ts(142,112): error TS1005: ',' expected.
node_modules/@types/jasmine/index.d.ts(142,113): error TS1136: Property assignment expected.
node_modules/@types/jasmine/index.d.ts(142,121): error TS1005: ')' expected.
node_modules/@types/jasmine/index.d.ts(142,147): error TS1005: '(' expected.
node_modules/@types/jasmine/index.d.ts(142,162): error TS1005: ']' expected.
node_modules/@types/jasmine/index.d.ts(142,163): error TS1005: ',' expected.
node_modules/@types/jasmine/index.d.ts(142,164): error TS1136: Property assignment expected.
node_modules/@types/jasmine/index.d.ts(142,165): error TS1136: Property assignment expected.
node_modules/@types/jasmine/index.d.ts(142,179): error TS1005: ',' expected.
node_modules/@types/jasmine/index.d.ts(142,183): error TS1005: ':' expected.
node_modules/@types/jasmine/index.d.ts(142,208): error TS1005: '{' expected.
node_modules/@types/jasmine/index.d.ts(142,217): error TS1005: ':' expected.
node_modules/@types/jasmine/index.d.ts(142,222): error TS1005: ',' expected.
node_modules/@types/jasmine/index.d.ts(142,227): error TS1005: ':' expected.
node_modules/@types/jasmine/index.d.ts(142,228): error TS1109: Expression expected.
node_modules/@types/jasmine/index.d.ts(142,230): error TS1005: ')' expected.
node_modules/@types/jasmine/index.d.ts(635,30): error TS1005: ';' expected.
node_modules/@types/jasmine/index.d.ts(720,1): error TS1128: Declaration or statement expected.
node_modules/@types/sinon/index.d.ts(1448,36): error TS1005: ';' expected.
node_modules/preact/dist/preact.d.ts(129,8): error TS1005: ';' expected.
node_modules/preact/dist/preact.d.ts(131,4): error TS1109: Expression expected.
node_modules/preact/dist/preact.d.ts(133,4): error TS1005: '(' expected.
node_modules/preact/dist/preact.d.ts(134,3): error TS1005: '(' expected.
node_modules/preact/dist/preact.d.ts(134,10): error TS1005: ')' expected.
node_modules/preact/dist/preact.d.ts(153,14): error TS1005: ';' expected.
node_modules/preact/dist/preact.d.ts(153,44): error TS1005: ';' expected.
node_modules/preact/dist/preact.d.ts(154,5): error TS1128: Declaration or statement expected.
node_modules/preact/dist/preact.d.ts(155,5): error TS1005: '(' expected.
node_modules/preact/dist/preact.d.ts(155,12): error TS1005: ')' expected.
node_modules/rxjs/internal/types.d.ts(81,44): error TS1005: ';' expected.
node_modules/rxjs/internal/types.d.ts(81,74): error TS1005: ';' expected.
node_modules/rxjs/internal/types.d.ts(81,77): error TS1109: Expression expected.

I think you need a tsconfig to tell it to ignore the node_modules folder (?)

Hi!
I try to debug GA with Google Analytics Debugger and I see than data not send to Google when page changes. ((
Data sends only if page is reload...

After updating to angular >= 4.2.0 all routes with lazy loading support aren't working. You can reproduce it using such steps:

1. Clone the repository of the sample app
   git clone https://github.com/ui-router/sample-app-angular.git
2. Install npm packages
   npm install
3. Run the AngularApp
   npm run ng serve
4. Open http://localhost:4200/#/home and try to navigate to such routes as messages, contacts, preferences.
   Actual result:

Transition Rejection($id: 0 type: 6, message: The transition errored, detail: TypeError: Cannot read property 'get' of undefined)
$defaultErrorHandler @ stateService.js:40
(anonymous) @ stateService.js:365
webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:365
onInvoke @ core.es5.js:3933
webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:364
webpackJsonp.../../../../zone.js/dist/zone.js.Zone.run @ zone.js:125
(anonymous) @ zone.js:760
webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:398
onInvokeTask @ core.es5.js:3924
webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:397
webpackJsonp.../../../../zone.js/dist/zone.js.Zone.runTask @ zone.js:165
drainMicroTaskQueue @ zone.js:593
stateService.js:42

TypeError: Cannot read property 'get' of undefined
    at multiProviderParentChildDelta (lazyLoadNgModule.js:153)
    at applyNgModule (lazyLoadNgModule.js:113)
    at applyModule (lazyLoadNgModule.js:53)
    at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:365)
    at Object.onInvoke (core.es5.js:3933)
    at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:364)
    at Zone.webpackJsonp.../../../../zone.js/dist/zone.js.Zone.run (zone.js:125)
    at zone.js:760
    at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:398)
    at Object.onInvokeTask (core.es5.js:3924)
    at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:397)
    at Zone.webpackJsonp.../../../../zone.js/dist/zone.js.Zone.runTask (zone.js:165)
    at drainMicroTaskQueue (zone.js:593)
    at <anonymous>

NodeJs v6.11
NPM v5.0.3

You can workaround this problem by changing package.config dependencies to use specific version of Angular 4.1.3 instead of ^4.0.0 that will install the latest (4.2.2 at the moment) angular packages.