角：建立一個指令，並從根元素

Question

刪除屬性是否有可能做這樣的事情：

<field:text id="foo" label="Foo Label" model="model.foo" placeholder="foo" />

這將被編譯爲：

<div class="control-group"> 
    <label class="control-label" for="foo">Foo Label</label> 
    <div class="controls"> 
     <input type="text" id="foo" placeholder="foo" ng-model="model.foo"> 
    </div> 
</div> 

我試圖讓一個例如，但Plunker不會讓我保存我的例子...將其上傳到保管箱：https://dl.dropbox.com/u/2862814/plunk.zip

該示例與諸如ng-chan GE。這是由於ng-change指令的編譯。我試着用fieldText指令的優先級，但沒有修復它。

Answer 1

在你的例子中，你非常接近，但是你必須在模板中的輸入字段中進行ng修改。您的舊代碼：

<field:text ng-change="updateHidden()" ... 

更改爲

<field:text change="updateHidden()" ... 

，並在指令（見http://docs.angularjs.org/guide/directive - &或& ATTR - 提供了一種方法來執行父範圍的情況下的表現。）

{scope:{change:'&' ... 

最後指令模板

<input ng-change="change()" ... 

這裏是一個modiefied和工作plunkr：http://plnkr.co/edit/QmQjGQQBRtDmkCka0dul?p=preview

<field:text id="too" label="Too" model="model.too" placeholder="too" change="updateHidden()"></field:text> 

<script type="text/ng-template" id="/tpl.html"> 
<div class="control-group"> 
    <label class="control-label" for="{{id}}">{{label}}</label> 
    <div class="controls"> 
     <input ng-change="change()" type="text" id="{{id}}" placeholder="{{placeholder}}" 
     ng-model="model"> 
    </div> 
</div> 
</script> 

directive('fieldText',function(){ 
    return { 
    restrict:'E', 
    templateUrl:'/tpl.html', 
    scope:{change:'&',id:'@',model:'=',placeholder:'@',label:'@'} 
    } 
})