knockout.jsライブラリには"attr" data bindingがあり、HTML要素属性の値（例：「タイトル」）を動的に変更できます。ただし、場合によっては、バインドされたオブジェクトの対応するオブザーバブルに応じて、属性が必要な場合とない場合があります。例えば、私のモデルが "タイトル"観測可能な場合、 "title"属性が存在すれば（非ヌル）属性が存在しない場合はそれをスキップ（null）することができます。knockout.jsに条件付きで要素属性を追加します。
ノックアウトは属性を条件付きで設定する方法を提供していますか？
[ノート]このような名前の質問は実際にはノックアウトのCSSクラスの特別な処理によって解決されたもので、この質問（またはそれ自身のタイトル）には関係しません。 ：How to conditionally render an css class with knockoutjs
（これは私が組み込みのノックアウトの代わりに手動で生成していたもの）を選択するときに必要でした。
<option
data-bind="text: text,
attr:{
value:value,
'selected': typeof(selected) !== 'undefined' ? selected : null
}">
Choice X
</option>
これは、常にに「テキスト」属性を更新すると「値」属性を追加することが、唯一のデータがすでに定義された「選択」の値がある場合は、「選択」を追加言います。
カスタムバインディングattrIfを作成して、属性を追加するかどうかの前に特定の観測可能なブール値をチェックします。この例を参照してください：
ko.bindingHandlers.attrIf = {
update: function (element, valueAccessor, allBindingsAccessor) {
var h = ko.utils.unwrapObservable(valueAccessor());
var show = ko.utils.unwrapObservable(h._if);
if (show) {
ko.bindingHandlers.attr.update(element, valueAccessor, allBindingsAccessor);
} else {
for (var k in h) {
if (h.hasOwnProperty(k) && k.indexOf("_") !== 0) {
$(element).removeAttr(k);
}
}
}
}
};
<a href="#" data-bind="attrIf: {title: title, _if: flag}">link</a>
華麗ですが深刻な問題です。「タイトル」以外の属性があり、それに適用することを希望しない場合は、_ifはそのままです。それでも、コードアイデアは良いです。 – Phil
あなたはいつでもko標準の 'attr'バインディング（_ifフラグの影響を受けません）を使用して他の属性を追加できます。例：data-bind = "attrIf：{title：title、_if：flag}、attr：{otherAttr：val}" – gbs
私は、要素にすでに存在する属性を条件付きでオーバーライドする必要があります。 01-data-bind = "_ if：flag、step：1" /> – MrTristan
私はちょうど@gbsに回答していることがしたいが、私はできません。私の解決策は、同じHTML要素のうちの2つ、属性に1つ、なしに1つ、ノックアウト条件で要素の1つを追加することでした。私はこのカスタムバイディングについても知っていますが、どちらがより効率的ですか？
同じ要素に5つの異なる属性がある場合はどうしますか？パースペクティブでたくさんの楽しみ... – Samuel
ノックアウトの「attr」データバインディングは、このシナリオをサポートしていますが、getDisabledState（）関数からnullまたは未定義を返すだけで、属性を送出しません。
この回答はKnockout attr binding with attributes like 'readonly' and 'disabled'
から取得された私は、観察可能なリターンがnullの場合はそれがデフォルトの動作だと思うが、私は間違っている可能性があります。空の値の場合に、title = ""の代わりに明示的に属性を設定しないようにする必要があるのはなぜですか？ –