AngularJS modalpopup服务调用无法读取undefined的属性

时间:2015-02-04 17:12:39

标签: angularjs modalpopup

我遇到了Angular JS弹出窗口的问题。我从弹出窗口提交数据,我想将数据传递给taskService,以便它可以调用WebAPI并存储到我的数据库中。 这是我从BoardCtrl调用打开模态窗口

$scope.showAddTask = function () {
        modalService.showModal({
            templateUrl: "Partials/AddTask.html",
            controller: "taskCtrl",
            inputs: {
                title: "Add Task"
            }
        }).then(function (modal) {
            //debugger;
            modal.element.modal();
            modal.close.then(function (result) {
            });
        });
    };

现在用户键入任务详细信息和提交。该调用在我的taskCtrl中 调试器确实点击了下面的代码,我可以看到最终用户提交的值。我面临的问题是我收到了错误 在taskService.addTask调用 错误是"无法读取属性' addTask'未定义"

    fpdApp.kanbanBoardApp.controller('taskCtrl', function ($scope, taskService) {

         $scope.close = function () {
                debugger;
                taskService.addTask($scope.Name, $scope.Desc, $scope.Estimate, 1).then(function (response) {
                    $scope.result = response.data;
                }, onError);
                close({
                    name: $scope.name,
                    Desc: $scope.Desc,
                    Estimate: $scope.Estimate,
                }, 500); // close, but give 500ms for bootstrap to animate
            };
});

这是我的taskService

fpdApp.kanbanBoardApp.service('taskService', function ($http, $q, $rootScope) {

    var addTask = function (name, desc, estimate, projectId) {
        debugger;
        //return $http.get("/api/TaskWebApi/AddTaskForProject").then(function (response) {
        //    return response.data;
        //}, function (error) {   
        //    return $q.reject(error.Message);
        //});
    };

});

有人可以帮助/指导我这里错了吗? 请注意,我在同一服务和控制器中有其他方法调用正常工作。 提前致谢 Venkat。

2 个答案:

答案 0 :(得分:0)

您需要在服务中公开addTask方法。现在它只是一个无法从外部访问的局部变量。构建服务时,应使用必要的方法创建适当的对象。因此,您应该使用addTask或使用此类方法返回对象来设置this.addTask = addTask

fpdApp.kanbanBoardApp.service('taskService', function ($http, $q, $rootScope) {

    var addTask = function (name, desc, estimate, projectId) {
        return $http.get("/api/TaskWebApi/AddTaskForProject").then(function (response) {
            return response.data;
        }, function (error) {   
            return $q.reject(error.Message);
        });
    };

    return {
        addTask: addTask
    };
});

答案 1 :(得分:0)

服务始终返回单个对象,并且可以由应用程序范围使用。 你忘了在服务上下文中编写方法,

var addTask更改为this.addTask

<强>代码

fpdApp.kanbanBoardApp.service('taskService', function($http, $q, $rootScope) {

    this.addTask = function(name, desc, estimate, projectId) {
        return $http.get("/api/TaskWebApi/AddTaskForProject").then(function(response) {
            return response.data;
        }, function(error) {
            return $q.reject(error.Message);
        });
    };
});

希望这可以帮到你。感谢。