Ng-repeat in Angular bind to HTML template in object {{ key.value }}

I've got an object in a service I'm trying to represent in the page markup. Notably a description key in the object that stores the local address of an HTML file with the relevant description.

Here is the object I'm referencing:

service.content = [
    {
        id: 'bootstrap-grid',
        title: 'The Complete Basics of the Bootstrap 3 Grid',
        type: 'article',
        date: 'February 28, 2015',
        description: 'articles/partial/BootstrapGrid/description.html',
        pathToHTML: 'articles/partial/BootstrapGrid/BootstrapGrid.html',
        ratingArr: [],
        updated: null,
    },
    {
        id: 'HTMLConverter',
        title: 'Blog-friendly HTML Converter',
        type: 'resource',
        date: 'March 6, 2015',
        description: 'components/HTMLconverter/description.html',
        pathToHTML: 'components/HTMLconverter/friendlyHTML.html',
        ratingArr: [],
        updated: null,
    }
];

Here is the markup I'm trying to work with. See the comment to pinpoint problem.

<div class="global-container" ng-controller="HomeCtrl">
    <h1>New Content</h1>
    <span ng-repeat="post in posts">
        <h1>
            {{ post.title }}
        </h1>
        <div>
            {{ post.date }}
        </div>
        <div class="post-title">
            <a ui-sref="post({ id: post.id })">
                {{ post.title }}
            </a>
        </div>

            <!-- How can I get this to display the contents of the local html file address at this location? -->
            {{ post.description }}

        <a ui-sref="post({ id: post.id })">
            Read Article
        </a>

    </span>

</div>

I tried ng-include but to no avail.

<ng-include src={{ post.description }}></ng-include>

I also tried creating a directive, but template URL doesn't include the current the lexical scope. What are my options here?