Comment avoir plusieurs attributs de liaison de données sur un élément?

94

J'ai besoin de plusieurs liaisons de données sur un élément. Par exemple, je veux une liaison de données hrefainsi qu'une htmlliaison de données sur une a balise. J'ai essayé ça,

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

Mais ça ne marche pas. Il semble que knockout ne prend en charge que la liaison d' une data-bind propriété? Comment lier à la fois l' attribut, le " " hrefinterne htmlet un " data-prop" personnalisé sur un élément?

javascript jquery knockout.js user960567
la source

Réponses:

127

Comme ça:

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

Vous utilisez des liaisons séparées par des virgules - l'attribut est le même que le passage d'un objet: 

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

Ou, si vous posez des questions sur plusieurs attrliaisons à la fois:

<a data-bind="html: name, attr: { href: url, 'data-prop': FullName }">
paulslater19
la source
Pouvez-vous aussi me dire que, si viewModel.tasks = ko.observableArray (tsks) puis en changeant viewModel.tasks = [new Array], Comment dire Knock que le tableau est changé
user960567
lorsque vous définissez une valeur ko.observable, essayez de le faire comme ceci: viewModel.tasks([1,2,3]);. C'est-à-dire que vous l'appelez en tant que fonction, en passant la nouvelle valeur en tant que paramètre
paulslater19
2

C'est ainsi que j'ai implémenté l'attribut source et l'événement de clic à l'aide de la liaison de données. Vous pouvez peut-être le trouver utile.

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

J'utilise simplement:

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

pour un élément de case à cocher.

Chris
la source
1

vous pouvez utiliser plusieurs propriétés en utilisant , comme ci-dessous

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

objet comme ça 

{ url: 'http://stackoverflow.com', id:'newid' , classvalue: 'classname' }
Surendra Kumar Ahir
la source