AngularJs Controller没有调用服务

时间:2017-05-12 11:46:50

标签: c# jquery angularjs asp.net-mvc

我是AngularJs的新手,如果我问一些愚蠢的东西,那就道歉了。

我使用angularSlideOutPanel通过调用控制器" TeacherDetailsController"来填充弹出窗口。控制器TeacherDetailsController进一步调用AnularJS服务,该服务调用MVC控制器的Action方法以获取Json格式的数据。

我得到的问题是我的TeacherDetailsController被触发但它从未命中

 $scope.GetTeacherInfo = function () 

我不知道如何调用GetTeacherInfo服务。

以下是我的相关代码:

控制器

    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>

1 个答案:

答案 0 :(得分:0)

尝试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();

   }])