如何在Ajax调用中调用控制器外部的Angularjs控制器函数

Question

我试图在控制器组件之外调用Angularjs函数，如下所示：

   <script type="text/javascript">
        function saveprof() {
            $('.spinner').show();
            $.ajax({
                type: "POST",
                url: "saveprof",
                enctype: 'multipart/form-data',
                async: true,
                data: {
                    'rinput_Aj': JSON.stringify(angular.element(document.getElementById('rdExampleApp')).scope().$func()),
                    'csrfmiddlewaretoken': $("input[name=csrfmiddlewaretoken]").val()
                },
                success: function (data, textStatus, jqXHR) {
                    $('#message').html(data);
                    window.location.href = 'myprofile';
                    window.location('myprofile');
                    $('.spinner').fadeOut();
                }
            });
        }
</script>

这是angularjs控制器代码：

 <script>
    var app = angular.module('rdExampleApp', ['ui.rdplot']);
    app.controller('rdPlotCtrl', function ($scope) {
        $scope.dataset = {
         "d0": { "id": 0, "name": "Housing", "value": 18 },
         "d1": { "id": 1, "name": "Travel", "value": 31.08 },
         "d2": { "id": 2, "name": "Restaurant", "value": 64 },
         "d3": { "id": 3, "name": "Bank", "value": 3 },
         "d4": { "id": 4, "name": "Movies", "value": 10 }
          };

          $scope.func = function func() {
                 var jdata = $scope.dataset;
                 return jdata;
            }
    });

   </script>

它会抛出一个错误Uncaught TypeError：无法读取未定义的属性'$ func'

编辑：建议之后，我将我的jquery ajax调用转换为Angularjs中的$ http函数..但它什么都没做..控制台中没有错误:(

这是我如何调用$ http服务函数

   <body ng-controller="rdCtrl">
        <a ng-click="saveprof()">Save</a>  

   <script>
    var app = angular.module('rdExampleApp', ['ui.rdplot']);
    app.controller('rdCtrl', function ($scope) {
        $scope.dataset = {
     "d0": { "id": 0, "name": "Housing", "value": 18 },
     "d1": { "id": 1, "name": "Travel", "value": 31.08 },
     "d2": { "id": 2, "name": "Restaurant", "value": 64 },
     "d3": { "id": 3, "name": "Bank", "value": 3 },
     "d4": { "id": 4, "name": "Movies", "value": 10 }
      };

      $scope.func = function func() {
             var jdata = $scope.dataset;
             return jdata;
        }, function ($scope, $http) {
        $scope.saveprof = function () {
            //show spinner        
            $('.spinner').show();
            $http.post('saveprof', {
                data: { 'data': JSON.stringify($scope.dataset) }
            })
                      .success(function (data) {
                          if (data == "null") {
                              //your code if return data empty 
                          } else {
                              //your code if return data not empty 
                              $('#message').html(data);
                          }
                          //hide spinner
                          $('.spinner').fadeOut();
                      })
                      .error(function (data, status, headers, config) {
                          console.log('error' + status);
                          //hide spinner in case of error
                          $('.spinner').fadeOut();
                      })
        }
    }
    );
</script>
</body>

我错过了什么？

Answer 1

为了向服务器运行XMLHttpRequest请求，你在angularjs中有很多选项，你不必乱用简单的javascript并调用角度范围来获取变量和函数。 您可以使用$ http或服务（暂时保留）。

我将展示如何使用原始角度的$ http发出请求。

首先，您必须在控制器的声明中导入$ http模块，如下所示：

 var app = angular.module('rdExampleApp', ['ui.rdplot']); app.controller('rdPlotCtrl', function ($scope,$http) {...});

在你控制器中你创建json对象，然后像这样执行请求：

  //show spinner $('.spinner').show(); $http.post('dal/addEventHalls.php', { data: {'data': $scope.datase} }) .success(function (data) { if (data == "null") { //your code if return data empty } else { //your code if return data not empty } //hide spinner $('.spinner').fadeOut(); }) .error(function (data, status, headers, config) { console.log('error' + status); //hide spinner in case of error $('.spinner').fadeOut(); })

你可以看到我们不使用url参数，但我们将url直接传递给post（）函数。 data参数用于放置您要发送到服务器的任何数据。

希望有助于好运。

UPDATE

我个人不用字符串化数据参数。我像json对象一样传递它们
进入php文件，为了获取数据，试试这个：
$ params = json_decode（file_get_contents（'php：// input'），true）; //从angular factory-service中读取值

如何在Ajax调用中调用控制器外部的Angularjs控制器函数

问题描述

1 个解决方案

解决方案1
3 已采纳 2015-11-30 17:55:55

如何在Ajax调用中调用控制器外部的Angularjs控制器函数

问题描述

1 个解决方案

解决方案1 3 已采纳 2015-11-30 17:55:55

解决方案1
3 已采纳 2015-11-30 17:55:55