angularjs - How can i put html inside javascript varaible -

currently have dirty way of coding function returns html.

is there better way can it.

i having hard time in inserting variables inside , looks dirty

function gettemplate (model, id) {     model = "test";     id = 5;     return '<div>' +            '<button class="btn btn-xs btn-info" title="view"' +            'ng-click="opentab(panes[1], "' + model + '", "' + id + '")">' +            '<span class="glyphicon glyphicon-cog"></span>' +            '</button>' +            '<button class="btn btn-xs btn-info" title="edit"' +            'ng-click="editmodal(model, id)">' +            '<em class="fa fa-pencil"></em>' +            '</button>' +            '<button class="btn btn-xs btn-danger" title="delete"' +            'ng-click="deleteentry(id, model)">' +            '<em class="fa fa-trash"></em>' +            '</button>' +            '</div>';  } 

edit:

i using angular ui grid . rendering these buttons inside column. needs celltemplate in html

i having hard time in inserting variables inside , looks dirty

using $templaterequest, can load template it’s url without having embed string. if template loaded, taken cache.

app.controller('mainctrl', function($scope, $templaterequest, $sce, $compile){     $scope.name = 'world';     $scope.gettemplate = function (model, id) {        // make sure no bad urls fetched. if have static string in       // example, might omit $sce call.       var templateurl = $sce.gettrustedresourceurl('nameoftemplate.html');        $templaterequest(templateurl).then(function(template) {           // template html template string           $scope.model = "test";           $scope.id = 5;           // let's put html element , parse directives , expressions           // in code. (note: example, modifying dom within           // controller considered bad style.)           $compile($("#my-element").html(template).contents())($scope);       }, function() {           // error has occurred       });     }; }); 

be aware manual way it, , whereas in cases preferrable way define directive fetches template using templateurl property.

further, may bind variables straightaway since they'd in same scope.

here's demo