**Pregunta**

Cómo bindar apropiadamente un objeto <select> a un VM de aurelia.io sin perder la funcionalidad de Select2 y manteniendo el bindado completo del <select> original.

**Contexto**

Estoy trabajando en un proyecto donde se ha implementado la librería *aurelia.io*, al tiempo que se está implementado en diversos puntos del proyecto el plugin *Select2*; el problema radica en que al inicializar el plugin este reemplaza el dom del *<select>* por una serie de divs y otros objetos, perdiéndose así el del select binding original, el cual permanece oculto a la vista, mientras se trabaja con el nuevo select artificial creado por el plugin *Select2*.


**UPDATE 1**

Este es un ejemplo de lo que se desea lograr.

Código HTML:

    <label>Seleccione la línea a la que pertenece la sublínea</label>    
    <select value.bind="currentSubLinea.Id">
           <option repeat.for="linea of Lineas" value.bind="linea.Id">${Linea.Nombre}</option>
    </select>


Código TypeScript:

    export class Linea {

        Lineas: linea[] = [];
	    currentSubLinea: subLinea = new subLinea();   
   
        showSelectedLineaId() { 
	
		     alert(this.currentSubLinea.Id);	

        }
	
	    attached() {
	  
            $("select").on("change", event => {

               showSelectedLineaId();

            });
		
		    $("select").select2();

        }
	

    }


**UPDATE 2**

He encontrado [esta respuesta en SOen][1] , pero en el ejemplo que se brinda el *Select2* sólo funciona en one-way, es decir, sólo actualiza en valor en el view model pero no se actualiza con los cambios en el mismo.


  [1]: http://stackoverflow.com/a/33470206/1920506