AngularJsコントローラがサービスを呼び出さない

Question

私はAngularJsを初めて利用しています。

私は、angleSlideOutPanelを使用して、コントローラ "TeacherDetailsController"を呼び出してポップアップを設定しています。コントローラのTeacherDetailsControllerは、MVCコントローラのActionメソッドを呼び出してJson形式のデータを取得するAnularJSサービスをさらに呼び出します。

私は取得しています問題は、私のTeacherDetailsControllerがトリガーされますが、それは私がGetTeacherInfoサービスを呼び出す方法を確認していないライン

$scope.GetTeacherInfo = function() 

を打つことはありません。以下は

私の関連するコードです：

コントローラ

var app = angular.module('myFormApp', [ 
    'angular-slideout-panel' 
]) 
.controller('HomeController', function ($scope, angularSlideOutPanel, $http, $location, $window) { 
    getallData(); 


//******=========Get All Teachers=========****** 
    function getallData() { 
     $http({ 
      method: 'GET', 
      url: '/Home/GetAllData' 
     }).then(function successCallback(response) { 
      // this callback will be called asynchronously 
      // when the response is available 
      $scope.ListTeachers = response.data; 
     }, function errorCallback(response) { 
      // called asynchronously if an error occurs 
      // or server returns response with an error status. 
      $scope.errors = []; 
      $scope.message = 'Unexpected Error while saving data!!'; 
      console.log($scope.message); 
     }); 
    }; 


    //******=========Get Single Customer=========****** 

    $scope.getTeacher = function (teacherModel) { 

     $http({ 
      method: 'GET', 
      url: ('/Home/GetbyID/' + teacherModel.TeacherNo), 
      params: { "TeacherNo": teacherModel.TeacherNo } 
     }).then(function successCallback(response) { 
      $scope.teacherModel =response.data; 
      getallData(); 
     }, function errorCallback(response) { 
      $scope.message = 'Unexpected Error while loading data!!'; 
      $scope.result = "color-red"; 
      console.log($scope.message); 
     }); 
    }; 

    //******=========slide Customer popup =========****** 
    $scope.openPanelRight = function (teacherModel) { 
     var panelInstance2 = angularSlideOutPanel.open({ 
      templateUrl: '/Templates/teacherDetail.html', 
      openOn: 'right', 
      controller: 'TeacherDetailsController', 
      resolve: { 
       Teacher: [ 
        function() { 
         return teacherModel; 
        } 
       ] 
      } 
     }); 
    }; 

}) 
.controller('TeacherDetailsController', ['$scope', 'TeacherService', 'Teacher', function ($scope, TeacherService, Teacher) { 

    $scope.Teacher = Teacher; 
     $scope.closePanel = function() { 
      $scope.$panelInstance.close('this is from the controller!!'); 
     }; 

     $scope.GetTeacherInfo = function() { 
      var TeacherInfo = TeacherService.GetTeacherInfo(Teacher.TeacherNo); 
      TeacherInfo.then(function (ord) { 
       $scope.Teacher = ord.data; 
      }, function() { 
       genericService.warningNotify("Error in getting Teacher Info"); 
      }); 
     } 
    }]) 

.config(function ($locationProvider) { 
    $locationProvider.html5Mode(true); 
}); 

サービス

app.service("TeacherService", ['$http', '$location', function ($http, $location) { 

    this.GetTeacherInfo = function (TeacherNo) { 
     var response = $http({ 
      method: "get", 
      url: "/Home/GetbyID?TeacherNo=" + TeacherNo 
     }); 
     return response; 
    } 


}]); 

MVCコントローラ

public class HomeController : Controller 
{ 
    [HttpGet] 
    public JsonResult GetbyID(int TeacherNo) 
    { 
     return Json(Workflow.Teacher.GetTeacher(TeacherNo), JsonRequestBehavior.AllowGet); 
    } 

} 

あなたは即座に、コントローラの負荷のデータが必要な場合は、HTML

<a href="#" ng-click="openPanelRight(teacherModel)" title="Edit Record"> 
     <div class="col-xs-12 col-sm-9"> 
      <span class="name">{{teacherModel.TeaFName}} {{teacherModel.TeaSName}}</span><br /> 
      <span class="fa fa-comments text-muted c-info" data-toggle="tooltip" title="{{teacherModel.TeaEmail}}"></span> 
      <span class="visible-xs"> <span class="text-muted">{{teacherModel.TeaEmail}}</span><br /></span> 
     </div> 
    </a> 

Answer 1

コールあなたTeacherDetailsController内部GetTeacherInfo() methosを呼び出します。

.controller('TeacherDetailsController', ['$scope', 'TeacherService', 'Teacher', function ($scope, TeacherService, Teacher) { 

     $scope.Teacher = Teacher; 
     $scope.closePanel = function() { 
      $scope.$panelInstance.close('this is from the controller!!'); 
     }; 

     $scope.GetTeacherInfo = function() { 
      var TeacherInfo = TeacherService.GetTeacherInfo(Teacher.TeacherNo); 
      TeacherInfo.then(function (ord) { 
       $scope.Teacher = ord.data; 
      }, function() { 
       genericService.warningNotify("Error in getting Teacher Info"); 
      }); 
     } 

     $scope.GetTeacherInfo(); //call here 
    }]) 

Answer 2

initを試してみてください。以下のようにしてください。

.controller('TeacherDetailsController', ['$scope', 'TeacherService', 'Teacher', function ($scope, TeacherService, Teacher) { 

    function init(){ 
    $scope.Teacher = Teacher; 
    $scope.GetTeacherInfo(); 
    } 

$scope.closePanel = function() { 
      $scope.$panelInstance.close('this is from the controller!!'); 
     }; 

     $scope.GetTeacherInfo = function() { 
      var TeacherInfo = TeacherService.GetTeacherInfo(Teacher.TeacherNo); 
      TeacherInfo.then(function (ord) { 
       $scope.Teacher = ord.data; 
      }, function() { 
       genericService.warningNotify("Error in getting Teacher Info"); 
      }); 
     } 

init(); 

    }])