AngularJs追加指令'；将元素添加到其模板中

如何将指令元素附加到其模板中？ 大概是这样的：

.directive('labelize',function(){
   return {
      restrict: 'A',
      template: '<div><ng-element/></div>'
      ...
   }
});

# Html
// <input labelize name="name"/>

# Output
// <div><input name="name"/></div>

.directive（'labelize'，function（）{
返回{
限制：“A”，
模板：“”
...
}
});
#Html
// 
#输出
// 

使现代化 当我使用此指令时：

app.directive 'labelize', () ->
      restrict: 'A'
      requrie: 'input'
      controller: [
           '$scope', '$element', '$attrs',
           ( $scope , $element , $attrs ) ->
                  $scope.label = $attrs.placeholder
      ]
      replace: true
      transclude: 'element'
      template: '<div class="labelize"><span class="label">{{ label }}</span><ng-transclude/></div>'

app.directive'labelize'，（）->
限制：“A”
请求：“输入”
控制器：[
“$scope”、“$element”、“$attrs”，
（$scope$element$attrs）->
$scope.label=$attrs.placeholder
]
替换：正确
排除：“元素”
模板：“{label}}”

使用此html：

<input labelize placeholder="Name" ng-class="{ 'red': true }" ng-focus="Focused()"/>

<!-- Angular compiled output -->
<div class="labelize" labelize placeholder="Name" ng-class="{ 'red': true }" ng-focus="Focused()" class="red">
    <input labelize placeholder="Name" ng-class="{ 'red': true }" ng-focus="Focused()"/>
</div>

---

ngFocus、ngClass或任何ng属性在

labelize

指令之后不起作用。

您可以使用transcure:'element'进行此操作

 .directive('labelize',function(){
    return {
        restrict: 'A',
        template: "<div ng-transclude></div>",
        replace:true,
        transclude: "element",


    }

.directive（'labelize'，function（）{
返回{
限制：“A”，
模板：“”，
替换：正确，
转移：“元素”，
}

输入：

输出：

---

我希望它对您有用。

什么是指令元素？绑定到指令的元素，在本例中为input element谢谢！我的问题解决了。但它的ng属性（如ng类）似乎无法编译，也无法详细更新您的问题。我可能会帮上忙。我不知道为什么ngFoucs和ngClass不能像ngChange和ngClic一样工作你工作得很好。