App from Socially tutorial with angular2 stuck in loading page on Android


I’m following the tutorial from meteor and angular 2 and when I reach the step 11 Running your app on Android or iOS with PhoneGap I can’t make it work on my android device.

This is the output I get from the console.

Error: Uncaught (in promise): Error: Error in ./AppComponent class AppComponent_Host - inline template:0:0 caused by: The selector "app" did not match any elements

This is what I have so far in my app.component.ts file:

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

import template from './app.component.html';

  selector: 'app',
export class AppComponent {}

The app works perfectly on the web browser. I think that can be a problem with the router, but I’m not quite sure.

This is the code from the app.routes.ts

import { Route } from '@angular/router';
import { Meteor } from 'meteor/meteor';

import { PartiesListComponent } from '../parties/parties-list.component';
import { PartyDetailsComponent } from '../parties/party-details.component';

export const routes: Route[] = [
  { path: '', component: PartiesListComponent },
  { path: 'party/:partyId', component: PartyDetailsComponent}

This is the index.html:

    <base href="/" />

And this is the app.component.html


It is supossed to redirect to the PartiesListComponent but just throw that error and stucks on loading. Thank you.



This is the original code in the main.ts (Extracted from the website of the tutorial)

import 'angular2-meteor-polyfills';

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

import { AppModule } from './imports/app/app.module';

const platform = platformBrowserDynamic();

I’ve just find that this tutorial is obsolete (again) and there’s a new way to bootstrap applications.

With the next code the app works fine on android.

import 'angular2-meteor-polyfills';

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { enableProdMode } from '@angular/core';
import { Meteor } from "meteor/meteor";
import { AppModule } from './imports/app/app.module';


Meteor.startup(() => {

I hope this help someone.


Thank you Sergio! I was stuck on this some time. Got it working with your suggestion. :slight_smile:

Here are couple of Cordova errors I received in case others run into this issue too:

Error: The selector “app” did not match any elements
Error: No base href set. Please provide a value for the APP_BASE_HREF token or add a base element to the document.