请问一下老师代码中如何点击a中的方法触发form里的验证。

Question

<section class="page">
    <header class="bar-nav">
      <a class="navBtn pull-left" onclick="window.history.back();"><span class="iconfont icon-xiangzuojiantou"></span></a>
    	<h1 class="title">添加工作记录</h1>
      <a class="navBtn pull-right" ng-click="savejob();">保存</a>
    </header>
  	<div class="page-content">
      <form>
          <div class="weui-cells__title">记录类型</div>
          <div class="weui-cells">
              <div class="weui-cell weui-cell_select">
                  <div class="weui-cell__bd">
                      <select class="weui-select" ng-model="type" ng-options="s.typeVal as s.typename group by site.typename for s in typelist"></select>
                  </div>
              </div>
          </div>
          <div class="weui-cells__title">工作内容标题</div>
          <div class="weui-cells">
              <div class="weui-cell">
                  <div class="weui-cell__bd">
                      <input class="weui-input" type="text" ng-model="title">
                  </div>
              </div>
          </div>
          <div class="weui-cells__title">工作日期</div>
          <div class="weui-cells">
              <div class="weui-cell">
                  <div class="weui-cell__bd">
                      <input class="weui-input" type="date" ng-model="workDate">
                  </div>
              </div>
          </div>
          <div class="weui-cells__title">工作内容具体</div>
          <div class="weui-cells weui-cells_form">
              <div class="weui-cell">
                  <div class="weui-cell__bd">
                      <textarea class="weui-textarea" rows="5" ng-model="content"></textarea>
                  </div>
              </div>
          </div>
      </form>
  	</div>
</section>

Answer 1

慕雪1613582 2017-02-28 12:00:01

应该可以写个指令，用事件广播来触发校验，参考一下它自带的validation-submit指令~

(function() {
  angular
    .module('validation.directive')
    .directive('validationSubmit', Submit);

  function Submit($injector) {
    var $validationProvider = $injector.get('$validation');
    var $timeout = $injector.get('$timeout');
    var $parse = $injector.get('$parse');
    return {
      priority: 1, // execute before ng-click (0)
      require: '?ngClick',
      link: function postLink(scope, element, attrs) {
        var form = $parse(attrs.validationSubmit)(scope);
        $timeout(function() {
          // Disable ng-click event propagation
          element.off('click');
          element.on('click', function(e) {
            e.preventDefault();
            $validationProvider.validate(form)
              .success(function() {
                $parse(attrs.ngClick)(scope);
              });
          });
        });
      }
    };
  }
  Submit.$inject = ['$injector'];
}).call(this);

• 提问者 GeekFish #1

  非常感谢！谢谢老师指导，我去试试。

Answer 2

慕雪1613582 2017-02-27 21:23:36

这个需要把a标签放入form表单中，然后添加validation-submit 属性

• 提问者 GeekFish #1

  那老师，请教一下除了这样的方法，如果不改变a标签的位置的情况下，我想做验证的话是不是需要自己写验证规则？