angularjs one template with multiple controllers

I am using UI-Router module to configure the States. I got multiple states working and route to a controller (TasksCtrl) and render in a template (TasksPendingTable). I need to have this template used by another controller (TaskSearchCtrl). Is it possible? Here is my States configuration.

/// <reference path="E:\Work\myApp\AngularSPA\AngularSPA\Views/TasksEndedTable.cshtml" />
/// <reference path="E:\Work\myApp\AngularSPA\AngularSPA\Views/TasksEndedTable.cshtml" />
'use strict';

angular.module('myApp', ['ui.router', 'myApp.controllers', 'myApp.filters', 'ui.bootstrap'])
    .config(['$stateProvider', '$locationProvider',
      function ($stateProvider, $locationProvider)
      {
        $stateProvider
            .state('tasksPending', {
              url: '/tasksPending',
              templateUrl: 'views/TasksPendingTable.cshtml',
              controller: 'TasksCtrl'
            })
            .state('tasksOverdue', {
              url: '/tasksOverdue',
              templateUrl: 'views/TasksPendingTable.cshtml',
              controller: 'TasksCtrl'
            })
            .state('tasksCompleted', {
              url: '/tasksCompleted',
              templateUrl: 'views/TasksPendingTable.cshtml',
              controller: 'TasksCtrl'
            })
            .state('tasksCancelled', {
              url: '/tasksCancelled',
              templateUrl: 'views/TasksPendingTable.cshtml',
              controller: 'TasksCtrl'
            })
            .state('taskSearchForm', {
              url: '/tasksSearchForm',
              templateUrl: 'views/taskSearch.cshtml',
              controller: 'TaskSearchCtrl'
            })
            .state('taskSearchResult', {
              url: '/tasksSearchResult',
              templateUrl: 'views/TasksPendingTable.cshtml',
              controller: 'TaskSearchCtrl'
            })
            .state('taskEdit', {
              url: '/tasks/:id/Edit',
              templateUrl: 'views/tasksEdit.cshtml',
              controller: 'TaskEditCtrl'
            })
            .state('taskAdd', {
              url: '/tasks/Add',
              templateUrl: 'views/taskAdd.cshtml',
              controller: 'TaskAddCtrl'
            })

            // Otherwise routes -----------------------------
            .state('otherwise', {
              url: '*path',
              templateUrl: 'views/404',
              controller: 'Error404Ctrl'
            });

        $locationProvider.html5Mode(true);

      }]);

If you want to have two controllers, then you should probably consider using a provider, such as a factory or service, instead. Controllers can have multiple injected factories so you can contain most of your logic in the factories instead of inside the controller. Here is a style guide I always use when making Angular apps and it contains information on how to properly set up a factory. I hope this helps!

What I do if I need two controllers in the same route is defining two directives contained in different controllers and then use this two directives in the route that I want to define.