Pregunta
Cómo bindar apropiadamente un objeto a un VM de aurelia.io sin perder la funcionalidad de Select2 y manteniendo el bindado completo del 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 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 , 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.