2017-01-07 17 views
1

我正在关注如何完成此操作的this答案(和this小提琴)。在ng-click上触发ng-submit

检视:

<section> 
    <form style="display: none" id="addFriendForm" name="vm.form.addFriendForm" class="form-horizontal" submit-on="submitAddFriendForm" ng-submit="vm.save(vm.form.addFriendForm.$valid)" novalidate> 
     <input ng-model="vm.userInput" required> 
    </form> 
    <div class="list-group"> 
     <a ng-repeat="user in vm.users" ng-click="vm.triggerSubmit(user)" class="list-group-item"> 
      ... 
     </a> 
    </div> 
</section> 

指令:

function submitOn() { 
    return { 
     link: function postLink(scope, element, attrs) { 
      scope.$on(attrs.submitOn, function() { 
       setTimeout(function() { 
        // Error: 
        element.trigger('submit'); 
       }); 
      }); 
     } 
    }; 
} 

控制器:triggerSubmit

// Trigger submit of the form 
function triggerSubmit(user) { 
    vm.userInput = user; 
    $scope.$broadcast('submitAddFriendForm'); 
} 

当通过这次行走,我得到的错误:

TypeError: element.trigger is not a function

...就行的指令突出。看着文档,这似乎是正确的。它失败的原因是什么?

答: (如果一个jQuery答案是想要的,看看下面的答案)

这样做的纯角的方法是:

angular.element(element).triggerHandler('submit'); 

回答

1

貌似trigger不JQLite的一部分,它带有角度。 您可能必须在加载angular之前加载JQuery。

<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>

OR

作为构建管道的一部分(咕噜/一饮而尽/的WebPack等)

+0

谢谢!我觉得这样做会有效,但是我发现了一个很好的做法 – wmash

+0

好啊。那会更好。谨慎地告诉我们如何? – Chanthu

0

见一个jQuery办法对方的回答。对于我使用的纯角度方法:

angular.element(element).triggerHandler('submit');