MobileFirst：如何使用 angularJS 将参数传递给适配器

Posted 2023-02-25

【中文标题】MobileFirst：如何使用 angularJS 将参数传递给适配器

【英文标题】：MobileFirst: How to pass parameters to adaptor using angularJS

【发布时间】：2016-05-25 04:23:58

【问题描述】：

我首先在 Mobile 中使用 angularJS，但由于适配器未接收到参数值而出现错误

需要知道如何使用$scope或不使用$scope在function(function($scope.userName, $scope.password)) & parameter(parameters : [$scope.userName, $scope.password])变量中传递参数

app.controller('loginController',function($scope)

    $scope.login = function($scope.userName, $scope.password)
        $scope.userNameTxt = angular.element('#usrName').val();
        $scope.passwordTxt = angular.element('#pass').val();
        console.log($scope.userName, $scope.password);
        $scope.userName = $scope.userNameTxt;
        $scope.password =$scope.passwordTxt;
        $scope.loginProcedure = 
                procedure : 'login',
                adaptor : 'SQL',
                parameters : [$scope.userName, $scope.password]
        ;

        WL.Client.invokeProcedure($scope.loginProcedure,
            onSuccess : $scope.loginSuccess,
            onFailure : $scope.loginFailure
        );

        $scope.loginSuccess = function(data)
        
            $scope.data = data;
            console.log($scope.data);
        ;

        $scope.loginFailure = function()
        
            console.log('failed');
        ;
    

);

【参考方案1】：

双向绑定

如果您在控制器中使用双向绑定，如下所示

<div ng-controller="loginController">
  <form ng-submit="login()">
    <input type="text" ng-model="username" placeholder="Username" />
    <input type="password" ng-model="password" placeholder="Password" />

    <input class="btn-primary" type="submit" value="Login"  />
  </form>
</div>

那么您可以使用以下内容：

app.controller('loginController',function($scope)

    $scope.login = function()
        $scope.loginProcedure = 
                procedure : 'login',
                adapter : 'SQL',
                parameters : [$scope.username, $scope.password]
        ;

        WL.Client.invokeProcedure($scope.loginProcedure,
            onSuccess : $scope.loginSuccess,
            onFailure : $scope.loginFailure
        );

        $scope.loginSuccess = function(data)
        
            $scope.data = data;
            console.log($scope.data);
        ;

        $scope.loginFailure = function()
        
            console.log('failed');
        ;
    
);

无约束力：

如果您没有为表单字段使用双向绑定，那么您可以尝试以下方法：

app.controller('loginController',function($scope)

    $scope.login = function()
        var username = angular.element('#usrName').val();
        var password = angular.element('#pass').val();

        $scope.loginProcedure = 
                procedure : 'login',
                adapter : 'SQL',
                parameters : [username, password]
        ;

        WL.Client.invokeProcedure($scope.loginProcedure,
            onSuccess : $scope.loginSuccess,
            onFailure : $scope.loginFailure
        );

        $scope.loginSuccess = function(data)
        
            $scope.data = data;
            console.log($scope.data);
        ;

        $scope.loginFailure = function()
        
            console.log('failed');
        ;
    

);

【讨论】：

这对我有用，但有没有使用 $scope 的方法？作为它的 angularJS 环境

@WorklightBeginner 检查答案的更新，如果可行，您能否将答案标记为正确？

错误为“[/AngularBootStrap/apps/services/api/AB/common/query] 失败。状态：500，响应：缺少 Json 查询参数适配器”

双向绑定什么都不做...没有事件

@WorklightBeginner 因为我们绑定了$scope 变量，所以我们不需要为控制器设置别名。我已经更新了视图，这是您唯一需要更新的内容