Javascript 如何使用Angular访问窗体内部同级指令的属性

我正在尝试为指令生成一个计数器，该指令将显示输入任意input.text或同一表单中的textarea的字符数，格式为

{{currentCharCount}}/{{maxCharCount}

本指令的使用方式如下：

<form name="form">
  <textarea name="username"></textarea>
  <div counter-for="username"></div>
</form>

我做了一个

我的方法是在

textarea

元素本身上创建一个指令：

<form name="form">
   <textarea name="username"
             ng-model="text" 
             ng-max-length="200"
             counter>

   </textarea>
</form>

app.directive('counter', function(){
  return {
    require: 'ngModel',
    link: function(scope, elm, attrs,ctrl){
      var max = attrs.ngMaxLength;
      var div = angular.element("<div>0/" + max + "</div>");
      elm.after(div);
      ctrl.$parsers.push(function(value){
        var count = (value || '').length + "/" + attrs.ngMaxLength;
        div.html(count);
        return value;
      });
    }
  }
})

考虑

• 最好尽量避免填充范围（使用额外的$watchers）
• 有很多方法可以获得同级作用域，但这是一种糟糕的设计，而且容易出错
• 没有一个作用域希望另一个作用域入侵它的领土，也没有一个作用域希望这样

---

对不起，我应该在问题中加入ng型号。我可以得到输入文本区域的值。但是如何从textarea获取属性呢？我不认为ng maxlength属性反映在表单的作用域中？是的，我一直希望避免一个解决方案，该解决方案要求我在要计数的元素上添加任何额外的内容。一个附加属性，用于在链接时将ng max length设置为作用域。您还可以将

textarea

包装并转置，以便在指令中访问它。兄弟指令彼此只是陌生人，它们之间的任何通信都只是另一层复杂性，除非您必须这样做，否则您不会这样做。