ngTouch打破表单/输入字段

时间:2015-04-09 06:45:22

标签: angularjs google-chrome hybrid-mobile-app angularjs-ng-touch

我们有一个混合的Angular应用程序正在经历可怕的300ms delay,即使它应该正常工作(因为已经设置了正确的元标记)。

我们尝试使用FastClick库解决此问题,它适用于iOS上的Safari和Android上的Firefox。但在Android上的Chrome中,同样的问题仍然存在。

我们尝试通过添加Angular ngTouch模块来替换FastClick,并解决了Chrome上大多数的问题。

现在由于某种原因,所有输入字段都不再有效。触摸它们正在被识别,因为字段的CSS发生了变化,但现在我们无法输入任何数据。长按输入使光标出现在输入字段内,但键盘不会出现在移动设备上。表单的提交按钮也不再有效。

此问题不仅在移动设备上可见,甚至在使用Chrome开发工具进行本地调试时也是如此。

我们正在使用Angular和Angular-touch的1.3.15版本。

以下是我们使用的登录表单的示例:

        <form name="login_form" class="form" shake submitted="submitted" ng-submit="login(login_form.$valid)" novalidate autocapitalize="none">

      <div class="form-group">
        <input type="text" name="name" class="form-control" ng-model="username" required />
        <label placeholder="{{'site.userName' | translate}}"></label>
        <div ng-show="(login_form.name.$invalid && login_form.name.$dirty) || (login_form.name.$pristine && submitted)" class="required">
          <span>{{'login.usernameRequired' | translate}}</span>
        </div>
        <!--<hr class="form-group-separator">-->
        <input type="password" name="password" class="form-control last-visible-form-control" ng-model="credentials.password" required />
        <label class="responsive" placeholder="{{'site.password' | translate}}"></label>
        <div ng-show="(login_form.password.$invalid && login_form.password.$dirty) || (login_form.password.$pristine && submitted)" class="required">
          <span>{{'login.passwordRequired' | translate}}</span>
        </div>

        <ul>
          <li>
            <label>{{'site.stayLoggedIn' | translate}}</label>
            <span class="value">
              <span class="form-check"
                 ng-class="{'checked':credentials.save}"
                 ng-model="credentials.save"
                 ng-click="toggleStayLoggedIn()"></span>  
            </span>
          </li>
        </ul>
      </div>

      <div class="form-group">
        <!--<button type="submit"></button>-->
        <button type="submit" class="cta green">
          {{'site.login' | translate}}
          <span data-svg-icon icon="circle-right-arrow"></span>
        </button>
      </div>
    </form>

0 个答案:

没有答案