How to lazy load google jsapi charts with angularjs?
<p>I'm having a single page application, but with different tabs.
Only for one tab I want to show a <code>google charts</code>. I don't want to include and load the charts js file <code>jsapi</code> directly, but only if the specific tab is accessed.</p>

<p>Therefore I have to add the js as follows dynamically:</p>

<pre><code>var script = document.createElement('script');
script.src = '//http://www.google.com/jsapi?ext.js';
document.body.appendChild(script);
</code></pre>

<p>Problem: how can I detect when the js has been completely loaded, so that I can continue as follows?</p>

<pre><code>if (whenJspaiLoaded()) {
    google.load('visualization', '1', {packages: ['corechart']});
    google.setOnLoadCallback(drawChart); //my custom function
}
</code></pre>