c# - 从外部javascript函数访问angularJs Controller 方法

Question

我想访问外部 javascript 函数 QCQAIssues() 中的函数 GetQCQAData()。GetQCQAData() 在 ng-controller 中定义。我怎样才能做到这一点 ？我已经尝试了很多方法来解决这个问题，但它不起作用。

function QCQAIssues() {
    $('#tblLegend').hide();
    createCookie("SelectTab", "QCQA");
    $('#tblQCQAIssue tr:gt(0)').remove();
}




var app = angular.module('myModule', []);
app.controller('QCQA', function ($scope, $http) {

    //$("[id$='ddlModuleBar']").append('<option  value=0>--------All--------</option>');
    //$("[id$='ddlSystemBar']").append('<option  value=0>--------All--------</option>');

    //GetSupportData();
    fetchSystemInformation();
    fetchModuleSelected();
    GetQCQAData();
    $scope.setSelected = function () {
        // console.log("show", arguments, this);
        if ($scope.lastSelected) {
            $scope.lastSelected.selected = '';
        }
        this.selected = 'rowSelect';
        $scope.lastSelected = this;
    }
    $scope.predicate = '-Date';

    //$scope.GetQCQAData=function(){


    function GetQCQAData() {
     blockUI();

     $http({
            method: 'Get',
            url: '/Home/GetQCQAData',
     }).success(function (data, status, headers, config) {
            $scope.QCQA = data.QCQAData;
            var fetchedQCQACountLen = data.QCQACount.length;


            if (fetchedQCQACountLen > 0) {

                $('#tblQCQAIssue tr:gt(0)').remove();
                $('#OpenKeyQ').removeClass('KeyOpen');
                $('#OpenKeyQ').addClass('KeyOpenIssue');
                $('#lblOpenCountQ').html("");
                $('#lblClosedCountQ').html("");
                $('#lblInProgressCountQ').html("");
                $('#lblOnHoldCountQ').html("");
                $('#lblInProgress3DaysCountQ').html("");
                var sv = getCookie('SelectTab');
                if (sv == 'Support') {
                    $('#tblLegendQcqa').hide();
                    $('#tblLegend').show();
                }
                else if (sv == 'QCQA') {
                    $('#tblLegendQcqa').show();
                    $('#tblLegend').hide();
                }




                for (var i = 0; i < fetchedQCQACountLen; i++) {

                    if (i == 0)
                        $('#lblOpenCountQ').html(' Open (' + data.QCQACount[i] + ')');
                    else if (i == 1)
                        $('#lblClosedCountQ').html(' Closed Today (' + data.QCQACount[i] + ')');
                    else if (i == 2)
                        $('#lblInProgressCountQ').html(' In Progress (' + data.QCQACount[i] + ')');
                    else if (i == 3)
                        $('#lblOnHoldCountQ').html(' On Hold (' + data.QCQACount[i] + ')');
                    else if (i == 4)
                        $('#lblInProgress3DaysCountQ').html(' Inactive for more than 3 working days (' + data.QCQACount[i] + ')');
                }

            }
            enablePinning: true;
            unblockUI();
            //$("[id$='ddlModuleBar']").append('<option  value=0>--------All--------</option>');
        }).error(function (data, status, headers, config) {
            unblockUI();
            $scope.message = 'Unexpected Error';
        });

 }

Answer 1

您可以通过多种方式做到这一点:-

将可重用的功能作为服务

app.service('GetQCQAData' ,function() {
  //your code here
});

然后在你的外部函数中

function QCQAIssues() {
     var $injector = angular.injector();
     var GetQCQADataFn = $injector.get('GetQCQAData');
 //your code here
}

结帐

AngularJS $injector Documentation

更新 - (添加了另一种方式)

**原型(prototype)方式**这不是首选，因为您无法保证 Controller 是否在 QAQAIssues() 调用之前执行(调用与定义 - 定义没问题)

你的外部函数

function QCQAIssues() {
  this.GetQCQADate();
  //this will be enhanced later 
  //you must be absolutely sure that QCQAIssues 
  //are called after the controller does its thing
}

在你的 Controller 中

app.controller('QCQA', function ($scope, $http) {
   var GetQCQAData = function () {
     ///your code
   };

    $scope.GetQCQAData = GetQCQAData;

    QCQAIssues.prototype.method = GetQCQAData;// 
}

总的来说——我会建议您不要混合使用不同的 namespace ，并建议您找到一种方法将您的外部函数封装在 AngularJS 中。认为 QAQCIssues 在顶层窗口对象上。