Modo HTML5 con Phonegap y AngularJS
Estoy tratando de hacer AngularJS html5 modo (true) funciona con Phonegap. Hice un montón de búsqueda antes de publicar esto, he intentado una combinación diferente de configuraciones, la adición de la etiqueta <base /> en meta (también intentó con <base href = "" />, <base href = "/" /> y Añadiendo el sufijo .html para enrutar los puntos finales, agregando $ delegate.history = false (como sigue) dentro del bloque .config </ href = "/" target = "_
$provide.decorator('$sniffer', function($delegate) { $delegate.history = false; return $delegate; });
Y obviamente
- Android 4 + html5 lienzo no volver a dibujar
- Cómo abrir un archivo PDF local en PhoneGap (android)
- Cordova-plugin-whitelist trabajando en Android pero no en iOS (Phonegap Build)
- La aplicación Ionic / Cordova no recibe notificación push en el fondo
- JQuery móvil + phonegap + android 4.0.4 encabezado parpadeo
$locationProvider.hashPrefix('!'); $locationProvider.html5Mode(true);
Pero no hay forma de que funcione, agregando tanto la etiqueta como el conjunto html5Mode a true dará como resultado una pantalla en blanco cuando se inicie la aplicación. También la adición de uno de ellos traerá al mismo resultado, pantalla en blanco.
Agregar etiqueta base con "android_asset" como sigue
Hará correctamente cargar el controlador principal, pero luego rompe el enrutamiento ….
Probado con los valores de atributo de destino "_blank" y "_self" …
Así que mi pregunta es, ¿se puede habilitar el modo html5 con Phonegap y AngularJS?
Estoy utilizando cordova versión 3.4.1-0.1.0 con AngularJS 1.2.16, probado en Android 4.0.4 dispositivo real y Android AVD 4.4.2
¡Cualquier consejo sería muy apreciado! Gracias
- Excepción de acceso ilegal con LocalStorage en Android Gingerbread
- El emulador de Android no instala la aplicación cuando se utiliza el comando 'emular android'
- Cómo obtener el número IMEI en PhoneGap?
- Selector de fecha y hora que no se muestra en la aplicación Android 4.1.2
- Cordova no puede construir para Android después de personalizar la configuración
- Importación de un proyecto PhoneGap en Android Studio
- ¿Cómo desactivo el botón de retroceso de Android en una página y cambio al botón de salida en cada otra página
- Aplicaciones móviles phonegap y control de versiones y actualizaciones
Basado en mi experiencia y en este comentario de Raymond Camden (que trabaja en PhoneGap) no es posible usar html5mode con PhoneGap + Angular.
Con el fin de evitar este problema con un sitio web existente, añadir una constante angularjs en el tiempo de construcción que indica si o no la construcción es para phonegap. En el momento de la configuración puede acceder a las constantes y optar por aplicar html5mode.
//Add this portion via your build scripts eg grunt or gulp //make the constant change depending on if this is a Phonegap build or not angular.module('myAppConstants', []).constant('PhonegapConstant', true); //How to use angular.module('myApp', ['myAppConstants']).config(function( $locationProvider, PhonegapConstant ) { if(!PhonegapConstant) { $locationProvider.html5mode(true); $locationProvider.hashPrefix('!'); } });
Acabo de conseguir este trabajo con angularjs 1.5, el nuevo componente de enrutador, y cordova (phonegap) 6.0.
Es un poco hacky, pero aquí es lo que tenía que hacer:
- Quite la etiqueta
<base href="/">
de su archivo html. - Establezca el modo html5 mientras establece requireBase a false
$locationProvider.html5Mode({ enabled: true, requireBase: false });
-
Atrapa las rutas de Córdoba (telefonía)
// iOS Cordova catcher // { path: '/var/**', component: 'cordova' }, // Android Cordova catcher // { path: '/android_asset/www/index.html', component: 'cordova' }
-
Haga un componente cordova que luego vuelva a donde quiera.
if(cookieService.loggedIn()) { $rootRouter.navigate(['Newsfeed']); } else { $rootRouter.navigate(['Title']); }
Ahora el resto de las rutas que puede utilizar normalmente. Me encontré con un problema con este método, sin embargo, todas mis imágenes locales y svgs necesidad de comenzar con la ruta completa, / android_asset / www / images para android, así que hice un pequeño filtro que escupe la ruta adecuada de activos para Web, android, y ios.
- El LED de notificación de Android no utiliza mi color
- ¿La instancia de aplicación siempre se crea antes de cualquier actividad?