AngularJS & ui.bootstrap.modal service templateUrl - Can I use Angular route?

Question

I'm pretty new to Angular but loving it! I am trying to create a modal dialog to display a partial view. ui.bootstap.modal has an option which takes the URL to the partial view to be displayed. I have a route configured on my application module that looks like this:

angular.module('buggy').config(['$routeProvider',
    function($routeProvider) {
        $routeProvider.
        when('/lists', {
            templateUrl: 'views/lists/list.html'
        }).
        when('/lists/create', {
            templateUrl: 'views/lists/create.html'
        }).
        when('/lists/:listId', {
            templateUrl: 'views/lists/partials/view.html'
        }). //more stuff

I would like to show the partial template defined as when(/lists/:listId) from the above routes. So in my controller I'm attempting to open the modal dialog like so:

 $scope.showList = function (list) {
            $modal.open({
            templateUrl:'lists/' + list._id,
            scope:$scope
        });
    }

The modal dialog opens but the contents are just [object]. Do I need to define the route on the server side or can I use Angular routing to return the partial?

Thanks!

Answer 1

My understanding of the $routeProvider was flawed. I blame years of jQuery'n ;) I've got it working now. I believe the $routeProvider was returning an instance of the controller defined in my module configuration; not the actually template. I've changed my code like so:

 $scope.showList = function (list) {
        $scope.currentList = list;
        $modal.open({
            templateUrl: 'views/lists/modals/view.html',
            backdrop: false,
            scope: $scope,
            controller: 'modalCtrl'
        });
    }

If this is not a good solution.. please comment. I have a lot to learn about Angular yet.

Thanks!