Bagaimana cara memiliki beberapa atribut data-bind pada satu elemen?

94

Saya perlu memiliki beberapa data binding pada satu elemen. Misalnya, saya ingin hrefserta htmlpengikatan data pada satu a tag. Saya sudah mencoba ini,

<a data-bind="html: name" 
   data-bind="attr: { href: url }" 
   data-bind="attr: { 'data-prop': xyz }">
</a>

Tapi ini tidak berhasil. Tampaknya sistem gugur hanya mendukung pengikatan satu data-bind properti? Bagaimana cara mengikat atribut href, bagian dalam html, dan " data-prop" ubahsuaian pada satu elemen?

javascript jquery knockout.js

— pengguna960567
sumber

127

Seperti ini:

<a data-bind="html: name, attr: { href: url }">

Anda menggunakan binding yang dipisahkan koma - atributnya sama dengan meneruskan objek:

{
    html: name, 
    attr: { href: url }
}

Atau, jika Anda bertanya tentang beberapa attrbinding sekaligus:

<a data-bind="html: name, attr: { href: url, 'data-prop': FullName }">

— paulslater19
sumber

Bisakah Anda juga memberi tahu saya bahwa, jika viewModel.tasks = ko.observableArray (tsks) kemudian mengubah viewModel.tasks = [Array baru], Bagaimana cara mengetahui bahwa array berubah

— user960567

saat menetapkan nilai ko.observable, cobalah melakukannya seperti ini: viewModel.tasks([1,2,3]);. Yaitu Anda menyebutnya sebagai fungsi, meneruskan nilai baru sebagai parameter

— paulslater19

2

Ini adalah cara saya menerapkan atribut sumber dan acara klik menggunakan data-bind. Anda mungkin merasa berguna.

<img data-bind="{click: function(data, event) {ESVendorWidget.loadFunction(data,event)},
                 attr: {src: $data.Photo.PhotoUrl }}"
     alt="package pic" class="big" />

— aamir sajjad
sumber

1

Saya hanya menggunakan:

<input type="checkbox"
    data-bind="click: callFunction(), checkedValue: 0, checked: Card.Days">

untuk elemen kotak centang.

— chris
sumber

1

Anda dapat menggunakan beberapa properti menggunakan , seperti di bawah ini

<a data-bind="attr: { href: url, id: id , class: classvalue}">

objek seperti ini

{ url: 'http://stackoverflow.com', id:'newid' , classvalue: 'classname' }

— Surendra Kumar Ahir
sumber