javascript - AngularJS - 工厂不工作/激活

Question

我正在尝试使用 AngularJS 和用 VB.NET 编写的 Web API(为我的实习做这件事)。

我定义了 angularApp，与我的 Controller 和工厂相同。 我也在使用 Angular 的路由，效果非常好。 我正在处理的问题是我的工厂未激活或无法运行。

请看下面的代码:

我的 AngularApp.js

var angularApp = angular.module('AngularApp', ['ngRoute']);
    angularApp.config(['$routeProvider',
    function ($routeProvider) {
        $routeProvider
        .when('/ExpenseOverview', {
            controller: 'ExpenseController',
            templateUrl: 'Views/ExpenseOverview.aspx'
        })
        .when('/AddExpense',
         {
             controller: 'ExpenseController',
             templateUrl: 'Views/AddExpense.aspx'
         })
        .otherwise({ redirectTo: '/ExpenseOverview' });
    }]);

我的费用 Controller :

angular.module("AngularApp").controller("ExpenseController", ["$scope", "ExpenseFactory", function ($scope, ExpenseFactory) {
    //variabelen
    $scope.expenses = [];
    $scope.id = 0;
    $scope.date = "";
    $scope.type = "";
    $scope.title = "";
    $scope.project = "";
    $scope.status = "";
    $scope.img = "";

    var shown = false;
    var dataURL = "";

    ExpenseFactory.getList($scope);
}]);

到目前为止，我的 Controller 除了通过 Web API 从数据库检索数据列表之外，没有做更多事情。

我的 ExpenseFactory.js

angular.module("AngularApp").factory("ExpenseFactory", ["$http", function ($http) {
    alert("test factory");
    var factory = {};

    //lijst van expenses ophalen
    factory.getList = function ($scope) {
        $http.post("/api/Expense/List")
            .success(function(data) {
                if (data === undefined || data == "") {
                    data = [];
                }

                $scope.expenses = data;
                $scope.id = $scope.expenses[$scope.expenses.length - 1].Id + 1;
            })
            .error(function() {
                alert("Er is een fout opgetreden");
            });
    };

    factory.saveList = function(expenseList) {
        $http.post("/api/Expense/SaveList", { 'expenses': expenseList })
            .success(function() {
                alert("Expenses have been saved succesfully!");
            })
            .error(function() {
                alert("Something went wrong while saving the expenses");
            });
    };
    return factory;  
}]);

如您所见，我已将警报作为工厂中的第一行代码。此警报甚至没有弹出，这意味着工厂没有激活/工作。

这段代码出了什么问题？

编辑 我将代码更新到当前版本，并添加了有关可能干扰代码的所有注释。我可以确认这一切都不起作用，因此错误发生在其他地方。

另一个注意事项:我正在使用 Visual Studio 2012，如果这可能与之有关，请详细说明我如何修复这个恶作剧。

Answer 1

您错过了从工厂方法返回 $http promise

factory.getList = function ($scope) {
    return $http.post("/api/Expense/List")
        .success(function(data) {
            if (data === undefined || data == "") {
                data = [];
            }

            $scope.expenses = data;
            $scope.id = $scope.expenses[$scope.expenses.length - 1].Id + 1;
        })
        .error(function() {
            alert("Er is een fout opgetreden");
        });
};

factory.saveList = function(expenseList) {
    return $http.post("/api/Expense/SaveList", { 'expenses': expenseList })
        .success(function() {
            alert("Expenses have been saved succesfully!");
        })
        .error(function() {
            alert("Something went wrong while saving the expenses");
        });
};

您应该创建一个像 $scope.model = {} 这样的模型对象，而不是传递整个范围，它将保存 ng-model 的所有值(范围变量)不要将整个范围传递给工厂，仅将相关数据传递给服务方法。