首页 > 解决方案 > 在按钮单击时使用 jquery 调用角度方法

问题描述

我想使用 jquery 按钮单击从角度控制器调用方法。

这是我的 HTML

<div class="actionBar">
    <select class="select select-primary form-control" id="ClassificationStepTechnical" required>
        <option value="">...</option>
        <option value="1">yes</option>
        <option value="2">no</option>
   </select>
   <input type="button" value="start" class="btn btn-primary" onclick="StartRequestStep()" />
</div>

<div id="StartRequest" ng-app="complaintRequest" ng-controller="CompalintController"></div>

我的jQuery功能:

function StartRequestStep() {
     if ($("#ClassificationStepTechnical").val() == "1") {
         angular.element($("#StartRequest")).vm().createComplaint();
     }    
}

我的角度控制器:

(function(){
    "use strict";

    angular.module("complaintRequest").controller("CompalintController", ["$state",CompalintController]);

    function CompalintController($state)
    {
        var vm = this;
        vm.createComplaint = function () {

            var stepToGo = 'Request.StartRequest'
            $state.go(stepToGo, { requestId: -1 });
        }

        vm.loginComplaint = function () {
            var stepToGo = 'Login.Authentication'
            $state.go(stepToGo,null);
        }

        vm.ClassificationRequest = function () {
            var stepToGo = 'Classification.ClassificationRequest'
            $state.go(stepToGo, null);
        }
    }
}())

我想在按钮单击时调用vm.createComplaint,但出现此错误

Uncaught TypeError: angular.element(...).vm is not a function

标签: javascriptjqueryangularjs

解决方案


var module = angular.module("complaintRequest", []);
module.controller("CompalintController", ["$scope", function($scope){
   $scope.createComplaint = function () {
    var stepToGo = 'Request.StartRequest'
    $scope.go(stepToGo, { requestId: -1 });
  }

  $scope.loginComplaint = function () {
    var stepToGo = 'Login.Authentication'
    $scope.go(stepToGo,null);
  }

  $scope.ClassificationRequest = function () {
    var stepToGo = 'Classification.ClassificationRequest'
    $scope.go(stepToGo, null);
  }
}]);

function StartRequestStep() {
     if ($("#ClassificationStepTechnical").val() == "1") {
        angular.element($("#StartRequest")[0]).scope().createComplaint();
     }   
}

这应该有效。顺便说一句,我看不到您的go功能在哪里。


推荐阅读