No final da aula 2 da atividade 7, foi inserido "no-gutters" no código, contudo na minha aplicação não surtiu efeito. Segue o código abaixo.
<p class="text-center text-muted" *ngIf="!photos.length">
Sorry, no photos.
</p>
<ol class="list-unstyled">
<li *ngFor="let cols of rows" class="row no-gutters">
<div *ngFor="let photo of cols" class="col-4">
<ap-photo [url]="photo.url" [description]="photo.description">
</ap-photo>
</div>
</li>
</ol>
Essa classe remove os espaços entre as colunas. Tem certeza que não funcionou? Se realmente não funcionou não faço ideia do motivo de não ter funcionado, pois é uma simples classe do Bootstrap. Qual seu navegador?
Vai tocando o curso até descobrirmos, pois não empacta no curso.
Estou utilizando o Google Chrome com Windows 10. Também não consegui entender o porque não funcionou.
Após finalizar o curso irei baixar o projeto completo para verificar se os espaços irão sumir, assim dou um retorno aqui.
Olhando seu código está tudo certinho.
Comigo também aconteceu o mesmo. Imagino ser alguma integração com a versão do Chrome.
No meu caso estou utilizando a versão 67.0.3396.99 (Versão oficial) 64 bits, no Mac.
Diminuindo a janela ele aplica o efeito, mas com a tela normal não. Já no Safari ele funciona dos dois modos conforme demonstrado pelo professor.
Deve ser algum bug do Bootstrap 4 (muito recente). Mas como o impacto é zero na App, bora continuar o projeto pessoal.
Sucesso e bom estudo para todos.