Javascript Promises on Angular Controller
<p>I don't familiar with JavaScript Promises function.</p>

<p>Currently I have this code on my Angular Controller</p>

<pre><code>$http.get('pages/about.html').then(function(response) {
    var raw_html = response.data;
    $scope.aboutHTML = raw_html.replace(/&lt;/g,"&amp;lt;");
});
</code></pre>

<p>I want to re-write the code so I could do something like this</p>

<pre><code>$scope.indexHTML = getHTML('pages/index.html');
$scope.aboutHTML = getHTML('pages/about.html');
...
</code></pre>

<p>with function like this</p>

<pre><code>function getHTML(url){
    $http.get(url).then(function(response) {
        var raw_html = response.data;
        return = raw_html.replace(/&lt;/g,"&amp;lt;");
    });
}
</code></pre>

<p>How to write the the code properly for the function above?</p>

<p><strong>[Update #1]</strong></p>

<p>Temporary Solution by <a href="https://stackoverflow.com/users/1175966/charlietfl">@charlietfl</a></p>

<pre><code>function getHTML(url){
    // return the promise
    return $http.get(url).then(function(response) {
        var raw_html = response.data.replace(/&lt;/g,"&amp;lt;");
        return  raw_html;
    });
}

getHTML('pages/index.html').then(function(raw_html){
    $scope.indexHTML = raw_html;
});
</code></pre>

<p>I wanna to write this function to reduce the manual work, with this way I still need to write down $scope.{page} for each page, so anyone know better way?</p>

<p><strong>[Update #2]</strong></p>

<p>Solution by <a href="https://stackoverflow.com/users/99777/joeytwiddle">@joeytwiddle</a></p>

<pre><code>function getHTML(url){
    // return the promise
    return $http.get(url).then(function(response) {
        var raw_html = response.data.replace(/&lt;/g,"&amp;lt;");
        return  raw_html;
    });
}

getHTML('pages/index.html').then(function(raw_html){
    $scope.indexHTML = raw_html;
});
</code></pre>