Um pouco sobre change detection

Angular só monitora a referência de this.fotos do nosso componente. Se alguém incluir ou remover um novo item da lista ele não saberá. Para isso, precisamos criar uma nova lista e atribuir essa lista em this.fotos. Como estamos reatribuindo um valor para a variável o Angular desencadeará seu mecanismo de deteção de mudança e renderizará a view. Nosso código fica assim:

import { Component } from '@angular/core';
import { FotoService } from '../foto/foto.service';
import { FotoComponent } from '../foto/foto.component';

@Component({
    moduleId: module.id,
    selector: 'listagem',
    templateUrl: './listagem.component.html'
})
export class ListagemComponent {

    fotos: FotoComponent[] = [];
    service: FotoService;

    constructor(service: FotoService) {

        this.service = service;
        this.service
            .lista()
            .subscribe(fotos => {
                this.fotos = fotos;
            }, erro => console.log(erro));

    }

    remove(foto) {

        this.service
            .remove(foto)
            .subscribe(
                () => {

                    console.log('Foto removida com sucesso');
                    let novasFotos = this.fotos.slice(0);
                    let indice = novasFotos.indexOf(foto);
                    novasFotos.splice(indice, 1);
                    this.fotos = novasFotos;
                }, 
                erro => console.log(erro)
            );

    }
 }