javascript - start - ui-router params

Pasando 2 $ stateParams usando ui-sref

Question

Estoy tratando de pasar 2 parámetros a mi controlador, ya que quiero recuperar información de 2 puntos finales API diferentes. El código que tengo cargará el html con datos basados ​​en el primer id: course.id parámetro id: course.id .

Cuando intento llamar a ambos, solo obtengo datos basados ​​en el primer id: course.id parámetro id: course.id no se devuelven datos para name: course.lecturer .

He seguido muchas preguntas y respuestas sobre este tema, pero encontré que esta pregunta y respuesta no se ajustaban a lo que quería . Pero cuando implementé la solución dada en la pregunta, recibí un error 404 de indefinido

Estoy confundido en cuanto a qué está causando esto.

app.js

var courseState = {
        name: ''course'',
        url: ''/course/:id?name'',
        templateUrl: ''app/views/course.html'',
        controller: ''CoursesDetailsCtrl''
    };
.state(courseState)

CourseDetailsCtrl

todoApp.controller(''CoursesDetailsCtrl'', [''coursesFac'',''lecturerFac'',''$scope'',''$state'',''$stateParams'', function CoursesCtrl(coursesFac, lecturerFac, $scope, $state, $stateParams){

    $scope.lecturer;
    $scope.courses;
    $scope.status;

    var name = $stateParams.lecturer;
    var id = $stateParams.id;

     $scope.state = $state.current
    $scope.params = $stateParams; 
    console.log(id);
    console.log(name);

    //getCourse() method calls the coursesFac factory/service which calls the api endpoint and returns 
    //the course information based on the course id.
    $scope.getCourse = function(id){
        coursesFac.getCourseById(id)
            .then(function (response) {
                $scope.courses = response.data;
                console.log($scope.courses);
            }, function (error) {
                $scope.status = ''Unable to load course data: '' + error.message;
                console.log($scope.status);
            });
    };

    //passes the state paramater in to the method. The paramater is the course Id 
    $scope.getCourse(id);


    $scope.getLecturer = function(name){
        lecturerFac.getLecturerByName(name)
            .then(function (response) {
                $scope.lecturer = response.data;
                console.log($scope.lecturer);
            }, function (error) {
                $scope.status = ''Unable to load lecturer data: '' + error.message;
                console.log($scope.status);
            });
    };
   $scope.getLecturer(name);


}]);

home.html

<li class="thumbnail" ng-repeat="course in courses" >
                    <a ui-sref="course({id: course.id, name: course.lecturer })">
                        <img  ng-src="{{course.picture}}" alt="" />
                    </a>
                </li>