如何将输入字段变成可重用字段？

Question

我有这个输入，上面有很多指令：

 <input class="form-control"
                                       mobile-number
                                       limit-characters
                                       number-only
                                       dir="ltr"
                                       ng-class="{'error-form-control': vm.form.step2.phoneNumber.$invalid && (vm.form.step2.phoneNumber.$dirty || vm.form.step2.phoneNumber.$touched)}"
                                       required
                                       ng-model="vm.formData.phoneNumber"
                                       name="phoneNumber"
                                       type="text">

我怎样才能把它变成像这样的可重用指令：

<phone-number ng-model="vm.formData.phoneNumber"></phone-number>

以及如何通过此指令使用 angular 表单验证？

Answer 1

我猜它看起来像这样

 app.directive('phoneNumber', function(){
       return {
          scope: {
             ngModel: '='
             classValidation: '=',
             inputName: '@'   
          },
          template: ' <input class="form-control" mobile-number limit-characters number-only dir="ltr" ng-class="classValidation" required ng-model="ngModel" name="{{inputName}}" type="text">',
          link: function(scope, elem, attr, ctrl) {

          }
       }
 })

HTML

 <phone-number ng-model="vm.formData.phoneNumber" input-name="phoneNumber" class-validation="{'error-form-control': vm.form.step2.phoneNumber.$invalid && (vm.form.step2.phoneNumber.$dirty || vm.form.step2.phoneNumber.$touched)}"></phone-number>

如何将输入字段变成可重用字段？

How to make an input field into a reusable field?

forms

directive

angularjs