Ng-submit不触发angular-touch / touch事件

ng-submit not firing with angular-touch / touch events

本文关键字：touch 事件 angular-touch Ng-submit      更新时间：2023-09-26

我有一个奇怪的问题，触摸事件不触发ng-submit或ng-click(在chrome设备开发工具)。Chrome开发工具模拟touchstart/touchend事件，所以我不确定为什么这不会工作。

给定以下HTML形式:

<form subscribe-to-newsletter ng-submit="subscribe.submitEmailSubscribe()" ng-class="{ error : subscribe.states.error, success : subscribe.states.success }">
    <div class="status-icon loading" ng-show="subscribe.states.loading"><i class="fa fa-circle-o-notch fa-spin"></i></div>
    <div class="status-icon success" ng-show="subscribe.states.success"><i class="fa fa-check"></i> Subscribed!</div>
    <input type="email" placeholder="Email Address" ng-model="subscribe.email">
    <button type="submit" class="hollow">Subscribe to newsletter</button>
</form>

和下面的指令/控制器:

angular.module('quiip.directives')
.directive('subscribeToNewsletter', subscribeToNewsletterDirective);
function subscribeToNewsletterDirective(){
    return {
        restrict: 'A',
        scope: {},
        bindToController: {},
        controllerAs: 'subscribe',
        controller: subscribeToNewsletterCtrl,
        link: function(scope, el){
            el.addClass('subscribe-to-newsletter');
        }
    }
}
function subscribeToNewsletterCtrl($scope, $http){
    this.states = {
        loading: false,
        success: false,
        error: false
    };
    this.email = '';
    this.submitEmailSubscribe = function(){
        console.log('submitting');
    }
}

控制台日志从不注册。它在桌面上工作得很好。奇怪的是，ng-submitted类被添加到表单。

我是否错过了ng-submit和触摸事件?

我建议你从组件的角度来考虑问题，比如一个通讯组件，或者把你的逻辑放在一个外部控制器中。您正在尝试访问指令外部的指令控制器。这是不可能的。我建议为您的功能创建一个组件，并将所有逻辑放入其控制器中。还要记得提供一个模板。现在你可以访问组件的控制器，就像你在上面的代码中使用controllerAs: 'subscribe'一样。

将标记放在单独的文件中或使用内联模板。然而，在我看来，把模板放在一个单独的文件中会让你的指令更容易读懂。

然后，例如，像这样使用你的指令:

<newsletter-component></newsletter-component>
相关文章：