5

私はKnockoutにかなり慣れていないので、出力をフォーマットする方法を探しています。このような例を見ましたが、もちろん私の試みはうまくいきません。

jsfiddleへのリンクは次のとおりです：http：//jsfiddle.net/cezmp/

<div id="VMDiv">    
<table>
   <thead>
      <tr>
         <th>Raw</th>
         <th>Formatted</th>
      </tr>
   </thead>
   <tbody>
       <tr>
          <td data-bind="text : SomeData "> </td>
          <td data-bind="text : formatPercent(SomeData())"> </td>
       </tr>
    </tbody>
</table>
</div>


<script type="text/javascript">
    function formatPercent(value) {
        return value.toFixed(2) + "%";
    }

    function vm() {
        var self = this;
        self.SomeData = ko.observable(62.1795972898);
    }

    ko.applyBindings(new vm(), document.getElementById("VMDiv"));
</script>
4

2 に答える 2

8

計算されたオブザーバブルの使用を検討できます。

div id="VMDiv">    
<table>
 <thead>
  <tr>
     <th>Raw</th>
     <th>Formatted</th>
  </tr>
 </thead>
 <tbody>
   <tr>
      <td data-bind="text : SomeData "> </td>
      <td data-bind="text : SomeDataFormatted"> </td>
   </tr>
 </tbody>
</table>
</div>

<script type="text/javascript">
    function vm() {
        var self = this;
        self.SomeData = ko.observable(62.1795972898);
        self.SomeDataFormatted = ko.computed(function(){
            return self.SomeData().toFixed(2) + "%";
        });
    }

    ko.applyBindings(new vm(), document.getElementById("VMDiv"));
</script>
于 2012-08-01T00:54:45.503 に答える
5

より一般的なソリューションが必要な場合は、次のようにすることができます

(function () {

    ko.extenders.isCurrency = function (target, options) {
        var result = ko.dependentObservable({
            read: function () {
                return Globalize.format(target(), "c");
            },
            write: target
        });


        result.raw = target;
        return result;
    };
} ());


ViewModel = function() {
    this.cashIsKing = ko.observable(565345.56435535).extend({ isCurrency: true});
};

ko.applyBindings(new ViewModel());

http://jsfiddle.net/5H5AK/

編集：オプションとしてtrueを使用する代わりに、オプションを含むオブジェクトリテラルを提供し、isCurrencyエクステンダーからそれを使用できます。

于 2012-08-01T07:58:08.740 に答える