BootstrapDialog and angularJS including html

Question

I am using https://github.com/nakupanda/bootstrap3-dialog to show dialogs on my webapp.

$scope.importFileWithSettings = function(){
                BootstrapDialog.show({
                        type: BootstrapDialog.TYPE_INFO,
                        message: "<div ng-include=\"'importform.html'\"></div>",
                        title: 'Title',
                });
            };

importform.html is in the same directory. When the dialog shows it does not show importform.html content. How to do it right (I am relatively new to angularJS and bootsrap)?

Poyraz Yilmaz · Accepted Answer · 2015-09-09 12:52:27Z

1

you can use script component of angularjs it is best way to include templates...

<script type="text/ng-template" id="exampleTemplateId">
   Content of the template.
</script>

then in you ng-include directive use it with its id

<div ng-include=\"'exampleTemplateId'\"></div>

for more details you can check docs

UPDATE

You can use $templateCache service of angularjs for this purpose...

in your run block you can use this service like this

var myApp = angular.module('myApp', []);
myApp.run(function($templateCache) {
  $templateCache.put('exampleTemplateId', 'This is the content of the template');
});

and again use it in ng-inlucde as I stated above

edited Sep 9, 2015 at 12:52

answered Sep 9, 2015 at 11:45

Poyraz Yilmaz

5,8671 gold badge28 silver badges28 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Marcin Majewski Over a year ago

But I have to place <script>...</script> in line in order to run it. Is it possible to place it in external file?

Poyraz Yilmaz Over a year ago

@MarcinMajewski u can use $templateCache service in your run config... let me add it on to answer...

Endre Simo · Accepted Answer · 2015-09-09 11:46:47Z

0

According to documentation this should work:

$scope.importFileWithSettings = function(){
    BootstrapDialog.show({
            type: BootstrapDialog.TYPE_INFO,
            message: "$('<div></div>').load('importform.html')",
            title: 'Title',
    });
};

answered Sep 9, 2015 at 11:46

Endre Simo

11.6k3 gold badges44 silver badges52 bronze badges

1 Comment

Marcin Majewski Over a year ago

I am getting error because it is trying to get "myhost:port/importform.html", but not the html that is in the same directory as script.

Collectives™ on Stack Overflow

BootstrapDialog and angularJS including html

2 Answers 2

2 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related