title: Knockoutjs formatCurrency function not working in view
body: <p>Copied the formatCurrency function from the Knockoutjs cart editor sample at <a href="http://knockoutjs.com/examples/cartEditor.html" rel="nofollow">http://knockoutjs.com/examples/cartEditor.html</a>, but cannot get it to work in the view like the example. It works when I call it from the view model though. I was also able to copy a currency binding handler and that works. My view and view model is below.</p>
  
  <pre><code>&lt;span&gt;Total salary: &lt;/span&gt;&lt;span data-bind="text: totalSalary"&gt;&lt;/span&gt;&lt;br /&gt;
  &lt;span&gt;Total salary: &lt;/span&gt;&lt;span data-bind="currency: totalSalary, symbol: '$'"&gt;&lt;/span&gt;&lt;br /&gt;
  &lt;span&gt;Total salary: &lt;/span&gt;&lt;span data-bind="text: totalFormattedSalary"&gt;&lt;/span&gt;&lt;br /&gt;
  &lt;span&gt;Total salary: &lt;/span&gt;&lt;span data-bind='text: formatCurrency(totalSalary)'&gt;&lt;/span&gt;
  </code></pre>
  
  <p>and view model:</p>
  
  <pre><code>// from http://tech.pro/blog/1863/10-knockout-binding-handlers-i-don-t-want-to-live-without
  ko.bindingHandlers.currency = {
      symbol: ko.observable('$'),
      update: function(element, valueAccessor, allBindingsAccessor){
      return ko.bindingHandlers.text.update(element,function(){
          var value = +(ko.utils.unwrapObservable(valueAccessor()) || 0),
          symbol = ko.utils.unwrapObservable(allBindingsAccessor().symbol === undefined
                  ? allBindingsAccessor().symbol
                  : ko.bindingHandlers.currency.symbol);
          return symbol + value.toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, "$1,");
      });
      }
  };
  
  function formatCurrency(value) {
      return "$" + value.toFixed(2);
  };
  
  var Teacher = function(id, name, salary) {
      this.id = id;
      this.name = name;
      this.salary = salary;
  };
  
  var viewModel = function(teachers) {
      var self = this;
      self.teachers = ko.observable(teachers);
      self.totalSalary = ko.computed(function() {
          var total = 0;
          $.each(self.teachers(), function() { total += this.salary; });
          return total;
      });
      self.totalFormattedSalary = ko.computed(function() {
          var total = 0;
          $.each(self.teachers(), function() { total += this.salary; });
          return formatCurrency(total);
      });
  };
  
  var initialTeachers = [
      new Teacher(1, "Tom", 40000),
      new Teacher(2, "Bill", 41000),
      new Teacher(3, "Bob", 42000)
  ];
  
  var vm = new viewModel(initialTeachers);
  ko.applyBindings(vm);
  </code></pre>
  
  <p><a href="http://jsfiddle.net/sfortner/wape5ts8/30/" rel="nofollow">JSFiddle</a></p>
  
  <p>TIA, Steve</p>
  
  <p>EDIT: if you hit F12 in Chrome, it's returning the error: "Uncaught ReferenceError: Unable to process binding "text: function (){return formatCurrency(totalSalary) }"
  Message: formatCurrency is not defined" where it's trying to call that function from the view. If you remove that last line in the view, no errors.</p>