Suppose I have a template like this:

```
    <div>
        <div>
            <span>Description:</span><span>{{YPOBatch.YarnPOBatch.YarnType.YarnTypeDesc}}</span>
        </div>
        <div>
            <span>ID:</span><span>{{YPOBatch.YarnPOBatch.YarnType.YarnTypeID}}</span>
        </div>
    </div>      

```

For purposes of writing clearer, easier to read and maintain code I want to be able to write something like:

```
    <div ng-directive-that-I-am-at-a-loss-for="YPOBatch.YarnPOBatch.YarnType">
        <div>
            <span>Description:</span><span>{{YarnTypeDesc}}</span>
        </div>
        <div>
            <span>ID:</span><span>{{YarnTypeID}}</span>
        </div>
    </div>      

```

so that both code blocks will be equivalent. Is there an angular out of the box directive that can do what I want?