Javascript 调用Angular应用程序范围之外的函数

我有以下角度代码：

app.controller('MainCtrl', function($rootScope, $http) {

    $rootScope.graph = {'width': '100%', 'height': 500};
    $rootScope.rectangles = [
        //     {'x':220,  'y':220,  'width' : 300, 'height' : 100},
        // {'x':520,  'y':220,  'width' : 10, 'height' : 10},
        //valid JSON:  {"rect":{"x":220,  "y":220,  "width" : 300, "height" : 100}, "info":""}
    ];

//more code

如您所见，我有一个由单个模块、单个控制器组成的应用程序

我有一个函数，其目的（与其他辅助函数一起）是填充数组矩形。该函数称为DrawMatrix

在HTML方面，使用此函数的代码如下所示：

 <div id="body">
    <div ng-controller="MainCtrl" ng-app="app">
        <div class="col-sm-6 col-md-6 col-lg-6" style="background-color: #D2D7D3">

            <div style="padding:25px;">

                <div class="col-sm-8 col-md-8 col-lg-8 input-group">
                    <span class="input-group-addon" id="basic-addon1">Number of questions:</span>
                    <input id="NumQuest" type="text" class="form-control" placeholder="Please enter number of questions..." aria-describedby="basic-addon1">
                </div>

                <div class="btn-group" role="group" aria-label="...">
                    <button ng-click="DrawMatrix(NumQuest)" type="button" class="btn btn-default">Draw</button>
                    <button ng-click="DelMatrix(NumQuest)" type="button" class="btn btn-default">Clean</button>
    //More code

问题数目：
画
清洁的
//更多代码

然后，我的界面上还有一组文本框，当您单击这些文本框时，会对其执行一些操作，此类操作的代码示例如下：

var totalNumOfQuestions = 1;
//Actualizar NumQuest de acordo com a variavel indicada acima!!
$(function(){
    $(document).on('focus', 'div.form-group-options div.input-group-option:last-child input', function(){

        var sInputGroupHtml = $(this).parent().html();
        var sInputGroupClasses = $(this).parent().attr('class');
        $(this).parent().parent().append('<div class="'+sInputGroupClasses+'">'+sInputGroupHtml+'</div>');

        //Testes
       // alert( totalNumOfQuestions);
        var NumQuest=document.getElementById("NumQuest").value;
        //alert(NumQuest);
        var $body = angular.element(document.querySelector('body'));   // 1
        var $rootScope = $body.scope().$root;         // 2
        $rootScope.$apply(function () {               // 3
            $rootScope.DrawMatrix(1);
        });
        totalNumOfQuestions+=1;
        //fim
    });

var totalNumOfQuestions=1；
//实现各种不同的目标！！
$（函数（）{
$（文档）.on（'focus'，'div.form-group-options div.input-group-option:last child input'，function（））{
var sInputGroupHtml=$（this.parent（）.html（）；
var sInputGroupClasses=$（this.parent（）.attr（'class'）；
$（this.parent（）.parent（）.append（“”+sInputGroupHtml+“”）；
//睾丸
//警惕（所有问题）；
var NumQuest=document.getElementById（“NumQuest”）.value；
//警报（NumQuest）；
var$body=angular.element（document.querySelector（'body'）；//1
var$rootScope=$body.scope（）.$root；//2
$rootScope.$apply（函数（）{//3
$rootScope.DrawMatrix（1）；
});
总数+=1；
//职能指令手册
});

正如你可能已经注意到的，我想做的是：

当我单击其中一个文本框时，我希望触发对AngularJS控制器中定义的函数的调用，而不是将警报作为操作发送

像这样的东西似乎接近我想要的，但是，我无法让它工作：

我知道这是一种不好的做法，我可能会使用服务、喷油器或其他东西，但我不知道，我只需要让它只为一个非常特殊的功能工作

---

任何帮助都将不胜感激。

我认为这只是您的

查询选择器
对于
$body
变量，它位于错误的DOM元素。它应该是您添加
ng控制器的元素

您可以通过以下方式获得：

var$rootScope=angular.element（$（'div[ng controller=“MainCtrl”]）.scope（）.$root；

请看下面或下面的“坏习惯”示例


angular.module（'demoApp'，[]）
.controller（'mainController'，函数（$rootScope）{
$rootScope.dummy='Test\r\n'；
$rootScope.addText=函数（文本）{
$rootScope.dummy+=text+'\r\n'；
};
});
$（函数（）{
$（“#测试”）。单击（函数（）{
var$rootScope=angular.element（$（'div[ng controller=“mainController”]）.scope（）.$root；
$rootScope.$apply（函数（）{
//scope.dummy+=“test”；//有效
$rootScope.addText（'test'）；
});
});
})；

测试
{{dummy}}
我认为是
$body
变量的
查询选择器位于错误的DOM元素。它应该是添加
ng控制器的元素

您可以通过以下方式获得：

var$rootScope=angular.element（$（'div[ng controller=“MainCtrl”]）.scope（）.$root；

请看下面或下面的“坏习惯”示例


angular.module（'demoApp'，[]）
.controller（'mainController'，函数（$rootScope）{
$rootScope.dummy='Test\r\n'；
$rootScope.addText=函数（文本）{
$rootScope.dummy+=text+'\r\n'；
};
});
$（函数（）{
$（“#测试”）。单击（函数（）{
var$rootScope=angular.element（$（'div[ng controller=“mainController”]）.scope（）.$root；
$rootScope.$apply（函数（）{
//scope.dummy+=“test”；//有效
$rootScope.addText（'test'）；
});
});
})；

测试
{{dummy}}

当我单击其中一个文本框时，我希望触发对AngularJS控制器中定义的函数的调用，而不是将警报作为操作发送

为什么不在文本框中使用或属性

当我单击其中一个文本框时，我希望触发对AngularJS控制器中定义的函数的调用，而不是将警报作为操作发送

你为什么不在文本框中使用或属性？
你应该使用它的完美解决方案你应该使用它的完美解决方案谢谢你的参考，这对我很有帮助，所以我向上投票：D感谢你的参考，这对我很有帮助，所以我向上投票：D