Question

我有这个HTML

<div ng-controller = "RetrieveCtrl as retrieve" >
    <form>
        <input ng-model = "retrieve.input1">
        <input ng-model = "retrieve.input2">

        <button type="submit" ng-click="retrieve.retrieveEntry()">Search</button>
.
.
.

使用此控制器

app.controller('RetrieveCtrl', ['$scope' , '$http', function($scope, $http) {

    $scope.retrieveEntry = function () {

        var input1 = $scope.retrieve.input1;
        var input2 = $scope.retrieve.input2;

        // validate input1 & input2 first...
        // input1 & input2 part of URL

        $http.get(...


        )

    };

}

工作正常，我能够从Web服务中检索我的数据。我想要做的是将函数重构为两个：

app.controller('RetrieveCtrl', ['$scope' , '$http', function($scope, $http) {

    $scope.clickSearch = function() {

        var input1 = $scope.retrieve.input1;
        var input2 = $scope.retrieve.input2;

        // validate input1 & input2 first...
        $scope.retrieveEntry(input1, input2);

    };

    $scope.retrieveEntry = function (a, b) {


        // build a and b in URL
        $http.get(...


        )

    };

}

这样我就可以在其他功能上重用$scope.retrieveEntry。但是，在将函数拆分为两个（按钮＆＃39; s ng-click更新为"retrieve.clickSearch()"）后，a和b变为未定义。我怀疑它与$scope有关，我对其发生的事情并不十分清楚（我仍然对此与$scope感到困惑）有人可以解释一下后面发生了什么以及如何解决这个问题吗？

感谢。

Answer 1

我不确定这是否会解决您的问题，但您没有正确使用控制器作为语法。您的控制器实现应该如下所示：

app.controller('RetrieveCtrl', ['$scope' , '$http', function($scope, $http) {
    var self=this;
    self.clickSearch = function() {
        // validate input1 & input2 first...
        self.retrieveEntry(self.input1, self.input2);

    };

    self.retrieveEntry = function (a, b) {


        // build a and b in URL
        $http.get(...


        )

    };

}

一旦开始使用控制器作为语法，您通常会向控制器添加功能，而不是直接添加范围。

$ scope.function的参数变为未定义

1 个答案: