Hola Sismacom. Si he entendido bien tu pregunta, creo que el problema es que no has entendido correctamente cómo funciona Angular.
En Angular las variables están vinculadas dinámicamente (binding), de manera que en cuanto cambies su valor en el código, esto se reflejará en la vista.
Por un lado, veo que usas JQuery. Esta práctica está muy desaconsejada en Angular (se usaba en las primeras versiones, pero ya no). Esto es así porque Angular debería aislarnos del DOM y ser él el que lo maneje. Esto es por dos razones, por un lado porque si cambias el DOM "a mano", Angular no se enteraría y los resultado podrían no ser los esperados, como te está ocurriendo a ti. Por otro lado, porque es posible que en un futuro el funcionamiento del DOM cambie e incluso en algunas plataformas desaparezcan objetos como "window" y "document".
En tu caso, has hecho correctamente la vista, pero te falla el código del componente. Como te digo, las variables están vinculadas, así que:
Para borrar la lista, simplemente haz lo siguiente en el código
Para añadir un elemento a la lista
O para eliminar una ciudad de la lista
Verás que al ejecutar cada una de las líneas anteriores, la vista se actualizará automáticamente.
Te recomiendo eliminar JQuery de tu proyecto y no acceder al DOM directamente mediante ids o similares.
Espero haberte ayudado.
En Angular las variables están vinculadas dinámicamente (binding), de manera que en cuanto cambies su valor en el código, esto se reflejará en la vista.
Por un lado, veo que usas JQuery. Esta práctica está muy desaconsejada en Angular (se usaba en las primeras versiones, pero ya no). Esto es así porque Angular debería aislarnos del DOM y ser él el que lo maneje. Esto es por dos razones, por un lado porque si cambias el DOM "a mano", Angular no se enteraría y los resultado podrían no ser los esperados, como te está ocurriendo a ti. Por otro lado, porque es posible que en un futuro el funcionamiento del DOM cambie e incluso en algunas plataformas desaparezcan objetos como "window" y "document".
En tu caso, has hecho correctamente la vista, pero te falla el código del componente. Como te digo, las variables están vinculadas, así que:
Para borrar la lista, simplemente haz lo siguiente en el código
lciudades = [];
Para añadir un elemento a la lista
lciudades.push("nueva ciudad");
O para eliminar una ciudad de la lista
lciudades.splice(1,1)
Verás que al ejecutar cada una de las líneas anteriores, la vista se actualizará automáticamente.
Te recomiendo eliminar JQuery de tu proyecto y no acceder al DOM directamente mediante ids o similares.
Espero haberte ayudado.