Archivos mensuales: Julio 2017

cordova, añadir propiedades al tag activity del AndroidManifest.xml

Android, Trabajo, ,

Recientemente he tenido que añadir algunas propiedades al Activity que crea cordova. Si os fijáis en el fichero AndroidManifest.xml, el cual se genera automáticamente cada vez que ejecutamos un cordova build android o un cordova run android, veréis que tiene un tag activity el cual tiene las propiedades con las que se ejecuta el Activity.


...
        
            
                
                
            
        
    ...

Imaginemos que lo queremos añadir al el atributo android:excludeFromRecents=”true”, como el fichero AndroidManifest.xml se genera dinámicamente, si lo modificamos directamente, al generar el apk se sobrescribirá y perderemos la modificación.

Por tanto tendremos que recurrir a la siguiente etiqueta en el config.xml del proyecto.

Lo interesante de la etiqueta edit-file es el atributo mode, que en este caso toma el valor de merge, lo cual significa que no tenemos que poner el tag activity todos los atributos, sino que solo los que queremos añadir y estos se añadirán a los ya existentes quedando de la siguiente manera:


...

            
                
                
            
        
...

Ionic 2 y Angular 2 – Tercera parte

iOS, Trabajo, Web,

Después de la primera y la segunda parte, ahora nos toca esta tercera en la que crearemos un servicio para que nuestra app puede obtener datos de manera sencilla.

Lo primero es declarar el servicio y nuestra clase Query del capítulo anterior en el fichero app/app.module.ts.

Primero importamos los módulos:


import { ApiService } from '../services/api.service';
import { Query } from '../services/query';

Y después los añadimos dentro del array de providers del @NgModule:

 providers: [
    StatusBar,
    SplashScreen,
    Query, // <--
    ApiService, // <--
    {provide: ErrorHandler, useClass: IonicErrorHandler}
  ]

Una vez hecho esto vamos a crear el archivo services/api.service.ts donde lo primero que haremos será importar nuestra clase Query y por otro lado importar la clase Injectable para que podamos usar este servicio en otras partes de la app.

import { Injectable } from '@angular/core';
import { Query } from './query';

A continuación defino la función que hará uso de la clase Query y un mapper para mis datos:

const doQuery = (query, params, mapper) => {
  return query.post('https://miapi.com/v1/', params, mapper);
};

const mapper = data => {
  data.var3 = data.var1 + data.var2;
};

Si no queremos procesar los datos que recibimos y nos sirven tan cual llegan la función de mapper quedaría de la siguiente forma:

  const mapper = data => data;

Y por último defino la clase del servicio en sí.

@Injectable()
export class ApiService {

  constructor(private query: Query) {
    this.query = query;
  }

  metodo1() {
    return doQuery(this.query, {}, mapper);
  }

  metodo2({param1, param2}) {
    return doQuery(this.query, {param1, param2}, mapper);
  }
}

En lo que hay que fijarse en esta clase es la llamada al constructor, la cual recibe como parámetro query que es de tipo Query y que ésta se asigna al objeto this, que es la clase en sí para poder usarla luego dentro de los distintos métodos.

Aquí tenéis el código completo del servicio:

import { Injectable } from '@angular/core';
import { Query } from './query';

const doQuery = (query, params, mapper) => {
  return query.post('https://miapi.com/v1/', params, mapper);
};

const mapper = data => {
  data.var3 = data.var1 + data.var2;
};

@Injectable()
export class ApiService {

  constructor(private query: Query) {
    this.query = query;
  }

  metodo1() {
    return doQuery(this.query, {}, mapper);
  }

  metodo2({param1, param2}) {
    return doQuery(this.query, {param1, param2}, mapper);
  }
}

En la próxima parte veremos cómo crear una página, utilizar el servicio y mostrar los datos recibidos.