7. Precisamos alimentar esse sistema

Fui acompanhando o primeiro video e implementando as alteracoes.

Aparentemente está tudo correto, mas quando tento abrir o cadastro de novos fotos usando:

http://localhost:3000/fotos/new

ele não mostra a foto.html e sim a principal.html, como se houvesse algum erro e a url aparece:

http://localhost:3000/fotos/new#/fotos

Os arquviso estão na seguinte posição:

main.js

angular.module('alurapic', ['minhasDiretivas','ngAnimate', 'ngRoute'])
.config(function($routeProvider, $locationProvider){


    $routeProvider.when('/fotos', {
        templateUrl: 'partials/principal.html', 
        controller: 'FotosController'
    });

    $routeProvider.when('/fotos/new', {
        templateUrl: 'partials/foto.html',
        controller: 'FotoController'
    });

    $routeProvider.otherwise({ redirectTo: '/fotos'});
});

foto.html

<div class="page-header text-center">
    <h1>{{foto.titulo}}</h1>
</div>

<form name="formulario" class="row" ng-submit="submeter()">
    <div class="col-md-6">
        <div class="form-group">
            <label>Título</label>
            <input ng-model="foto.titulo" name="titulo" class="form-control">
        </div>
        <div class="form-group">
            <label>URL</label>
            <input ng.model="foto.url" name="url" class="form-control">
        </div>
        <div class="form-group">
            <label>Descrição</label>
            <textarea ng-model="foto.descricao" name="descricao" class="form-control"></textarea>
        </div>

        <button type="submit" class="btn btn-primary">Salvar</button>
        <a href="/" class="btn btn-primary">Voltar</a>
        <hr>
    </div>
    <div class="col-md-6">
        <minha-foto url="{{foto.url}}" titulo="{{foto.titulo}}"></minha-foto>
    </div>
</form>

foto-controller.js

angular.module('alurapic').controller('FotoController', function($scope){
    $scope.foto={};

    $scope.submeter = function(){
        console.log($scope.foto);
    };
})