Question

我正在努力研究SPA，并宣布了一个像这样的工厂

// configure the PersonalDetails service
app.factory("PDService", function ($http) {
    var thisPDService = {};
    // get the data from database
    thisPDService.Get = function () {
        var promise = $http({
            method: 'GET',
            url: '/api/PersonalDetails'
        })
            .then(function (response) {
                return response.data;
            },
            function (response) {
                return response.data;
            });
        return promise;
    };
    return thisPDService;
});

我的控制器看起来像这样

app.controller("PDController", function ($scope, PDService) {
    $scope.Title = "Personal Details List";

    $scope.GetMyData = PDService.Get().then(function (d) {        
            $scope.PersonalDetails = d;
        });
});

并且查看

<table class="table table-striped table-responsive">
    <tr>
        <th>First Name</th><th>Last Name</th><th>Age</th><th>Active</th>
    </tr>
    <tr ng-repeat="d in PersonalDetails">
        <td>{{d.FirstName}}</td><td>{{d.LastName}}</td><td>{{d.Age}}</td><td>{{d.Active}}</td>
    </tr>
</table>

一切都很好但问题是当我导航到这个视图时，它会自动调用加载表中数据的PDService的Get（）方法。我不想那样做。

即使我在工厂中声明了另一个方法，该方法也会自动调用。

任何帮助都会非常感激。

Answer 1

你应该像这样改变控制器。

$scope.GetMyData = function() {

    PDService.Get().then(function (d) {        
                $scope.PersonalDetails = d;
            });
    };

当您需要填写数据时，只需拨打 GetMyData

即可

Answer 2

您正在控制器中调用服务的.Get（）方法。

$scope.GetMyData = PDService.Get().then(function (d) {        
        $scope.PersonalDetails = d;
});

此行将.Get（）方法的结果赋给变量$ scope.GetMyData。

相反，请尝试：

$scope.GetMyData = PDService.Get;

或者，更好的是，只需将$ http服务注入您的控制器并在那里创建一个get函数。您的服务只是带有特定URL的$ http包装，可以存储为常量。

$scope.getMyData = function() {
     $http.get('/api/PersonalDetails')
         .then(handleSuccess, handleError);
};

工厂服务自动调用$ http服务

2 个答案: