angular.module('materialscommons').component('mcExperimentTaskDetails', {
    templateUrl: 'app/project/experiments/experiment/components/tasks/mc-experiment-task-details.html',
    controller: MCExperimentTaskDetailsComponentController,
    bindings: {
        task: '='
    }
});

/*@ngInject*/
function MCExperimentTaskDetailsComponentController($scope, editorOpts, templates, experimentsService,
                                                    $stateParams, toast) {
    let ctrl = this;

    $scope.editorOptions = editorOpts({height: 25, width: 20});

    ctrl.selectedTemplate = (templateId, processId) => {
        var t = templates.getTemplate(templateId);
        ctrl.task.template = t;
        console.log('selectedTemplate', templateId, processId);
    };

    ctrl.updateTaskNote = () => {
        if (ctrl.task.note === null) {
            return;
        }

        experimentsService.updateTask($stateParams.project_id, $stateParams.experiment_id, ctrl.task.id,
            {note: ctrl.task.note})
            .then(
                () => null,
                () => toast.error('Unable to update task note.')
            );
    };
}

@@ -624,120 +624,295 @@
     
-var t = templates.getTemplate(templateId);%0A        ctrl.task.template = t;%0A        console.log('selected
+console.log('selectedTemplate', templateId, processId);%0A        experimentsService.addTemplateToTask($stateParams.project_id, $stateParams.experiment_id,%0A            ctrl.task.id, %60global_$%7BtemplateId%7D%60)%0A            .then(%0A                () =%3E ctrl.task.template = templates.get
 Template
 ', t
@@ -899,35 +899,33 @@
 ates.getTemplate
-', 
+(
 templateId, proc
@@ -914,35 +914,115 @@
 e(templateId
-, processId
+),%0A                () =%3E toast.error('Unable to associate template with task')%0A            
 );%0A    %7D;%0A%0A 

Use experimentsService to add the chosen template to the task (on the backend).