占位符属性中的ng-maxlength

Question

是否有一种简单的方法来定义每个文本框的占位符文本

以：

的形式

"请输入最大的x chars"，其中x是ng-maxlength的内容

或我必须手动写下它：

<input class="form-control" ng-model="valueBag.test" 
    ng-maxlength="30"
    placeholder="Please enter a maximum of 30 Chars">

我已经有30多个现有输入的表格，我想将占位符添加到每个表格中（这是很棒的，而不是手动执行）。

Answer 1

我认为您可以创建一个简单的指令：

app.directive('formControl', function() {
  return {
    restrict: 'C',
     link: function(scope, e, attr) {
         var el = e;
         if (attr['ngMaxlength']) {
             el.attr('placeholder', 'Please enter a maximum of ' + attr['ngMaxlength'] + ' Chars')
         }
     }
  }
});

这将应用于具有form-control和ng-maxlength类的任何元素。

演示：http：//plnkr.co/edit/m1k49l2phahaamfxrrk6?p=preview

您可能可以摆脱创建输入元素指令，因此不需要类：

app.directive('input', function() {
  return {
    restrict: 'E',
     link: function(scope, e, attr) {
         var el = e;
         if (attr['ngMaxlength']) {
             el.attr('placeholder', 'Please enter a maximum of ' + attr['ngMaxlength'] + ' Chars')
         }
     }
  }
});

有关指令的角度帮助文档现在很棒（过去不是这样）：http：//docs.angularjs.org/guide/directive