0

次のようなテーブルを作成しています。

<table>
  <thead>
    <tr>
        <th>Index</th>
        <th>Last Name</th>
        <th>First Name</th>
    </tr>
  </thead>
  <tbody data-bind="foreach: $data">
    <tr data-bind="css: rowClass">
        <td data-bind="text: $index"></td>
        <td data-bind="text: LName"></td>
        <td data-bind="text: FName"></td>
    </tr>    
  </tbody>
</table>

knowckout.mapping 機能を使用して、コントローラーからデータを取得し、json にエンコードしています。私のjavascriptは以下です。

<script type="text/javascript">
    $(function () {
        var viewModelJSON = ko.mapping.fromJSON('@Html.Raw(jsonData)');

        viewModelJSON.rowClass = ko.computed(function () {
            return 'success';
        });

        ko.applyBindings(viewModelJSON);
    });
</script>

css rowClass のデータバインドを追加するまで、すべてがうまく機能していました。私は単に成功クラスを返そうとしていますが、javascript コンソールは「バインディングを解析できません」と「rowClass が定義されていません」と報告します。また、rowClass関数を次のように宣言しようとしました:

viewModelJSON.rowClass = ko.computed(function () {
            return 'success';
        }, viewModelJSON);

しかし、まだ運がありません。私が間違っていることについて何か考えはありますか？

ワーキングソリューション

JavaScript を更新すると、問題が解決したようです。

<script type="text/javascript">
    $(function () {

        var mapping = {
            create: function (options) {
                return new myImportItem(options.data);
            }
        }

        var myImportItem = function (data) {
            ko.mapping.fromJS(data, {}, this);

            this.rowClass = ko.computed(function () {
                return 'success';
            }, this);
        }

        var viewModelJSON = ko.mapping.fromJSON('@Html.Raw(jsonData)', mapping);            

        ko.applyBindings(viewModelJSON);
    });
</script>
4

1 に答える 1

1

バインディングを追加する場所ではcss、コンテキストは配列内のアイテムになります。ただし、rowClass計算済みをルート レベルに配置しました。

それに対してバインドしたい場合は、css: $parent.rowClassorのようにする必要がありますcss: $root.rowClass(この場合は同じです)。

配列内の各項目にrowClass計算済みを持たせたい場合は、マッピング プラグインのマッピング オプションを使用して確認する必要があります。

于 2012-11-25T03:58:38.900 に答える