0

I am using ngDialog.open() to open a dialog. I want to pass in the template id to the function like this: 

ngDialog.open({template: 'templateid'});

However, from the Network history, I find it is trying to fetch the templateid as a file on server.

I feel the ngDialog.open() function's interface design is a little confusing: The value of template options parameter can be either inline immediate HTML, or the file path of an HTML file on server, or the id of a <script> element. How should I distinguish them?

Thanks!

gm2008
  • 4,245
  • 1
  • 36
  • 38

1 Answers1

2

There are 2 options, not 3: either the filename for the template, or the template as a string. To provide the template as a string you set plain: true in the options to open(), so otherwise it will be interpreted as a filename.

The third option -- selecting the template by id -- is actually using a filename that is in Angular's $templateCache. If the name you provide is not in $templateCache for some reason, then it will be requested from the server.

One way to add a template to $templateCache is to use a script tag like this (example from Angular docs):

<script type="text/ng-template" id="templateId.html">
  <p>This is the content of the template</p>
</script>

The main caveat here is that this must be somewhere inside the element that you have ng-app on.

The $templateCache docs also note that you can add a template in code by injecting $templateCache and calling $templateCache.put() and get one by calling $templateCache.get() which could be useful in debugging your situation.

Jason S
  • 13,538
  • 2
  • 37
  • 42