Best way to load/store ndDialog template?

Question

I am using ngDialog to display a modal window with an alert message.

I have the modal window working however the code looks messy.

I am wondering is it possible to replace the raw html template with a link to a html file instead of writing the HTML within the function itself.

   $scope.openDialog = function(components) {
            $scope.selected = components.component;
            ngDialog.open({
                template: '<h4>' + 'Alert' + '</h4>' + 
                          '<table class="table">' +
                          '<tr><th>Type</th><td>' +  components.type + '</td></tr>' +
                          '<tr><th>Component</th><td>' +  components.component + '</td></tr>' +
                          '<tr><th>Created</th><td>' +  components.created + '</td></tr>' +
                          '<tr><th>Alert</th><td>' + components.alert + '</td></tr>'+                     
                          '</table>',
                plain: true
            });
        };

Answer 1

Yep, just use templateUrl rather than template.

$scope.openDialog = function(components) {
        $scope.selected = components.component;
        ngDialog.open({
            templateUrl: 'yourfilename.html',
            plain: true
        });
    };