Widget HTML template

Use the HTML template in the Widget Editor to leverage Angular JS's two-way binding to bind your controller variables to your markup. It uses the controllerAs c syntax for basic binding.

This information is for pro code users. Only make changes to HTML templates if you have a firm understanding of AngularJS.

For example, the Stock widget uses the following HTML:
<div>
  ${Symbol Lookup}: 
  <input ng-model="c.data.symbol" ng-model-options="{debounce: 750}" ng-change="c.update()" placeholder="{{::data.typeSymbolMsg}}" />
  <div ng-show="c.data.symbol" style="font-size: 2em;">        
    <p>${Stock Price}: 
      <span ng-if="!c.data.price">${Requesting stock price}</span><span>{{c.data.price | currency:"$"}}</span>
    </p>
    <img ng-src="http://chart.finance.yahoo.com/z?s={{c.data.symbol}}&t=1d&z=l" />
  </div>
</div>