The Angular interpreter is very useful, but I'm having a difficult time
using values from it inside custom JavaScript.
Thus far, the only means I can find of accessing variables is something
like:
%angular
<div id="dummy" vars="data1,data1Schema,data2,data2Schema"></div>
<script type="text/javascript">
var div = $('#dummy');
//Given an element in the note & list of values to fetch from Spark
//window.angularVars.myVal will be current value of backend Spark val of
same name
function hoist(element, varNames){
window.angularVars = {};
var scope =
angular.element(element.parent('.ng-scope')).scope().compiledScope;
$.each(varNames, function(i, v){
window[v+'-watcher'] = scope.$watch(v, function(newVal, oldVal){
console.log('Setting ' + v + ' to:\n');
console.log(newVal);
window.angularVars[v] = newVal;
});
});
}
hoist(div, div.attr('vars').split(','));
</script>
Then in later paragraphs, I can access window.angularVars['data1'], etc.
It feels quite hacky. Is there a better way to enable use of angular bound
variables inside custom JS?
