Liaison multiple de données dans knockout js

J'ai deux propriétés de texte données de la Date et de la Ville sont observables.
J'ai besoin de concaténer deux de texte données de la propriété dans unique div.
et s'applique de style différente pour les deux textes.
Scénario actuel est utilisé knockoutjs de données-lier la propriété :

<div class="date" data-bind="text:Date" />
<div class="city" data-bind="text:City" />

Prévu :

<div class="date city" data-bind=" text:Date text:City" />

De Sortie : 2013-05-24 New York

Merci de me guider comment faire cela.

source d'informationauteur user2706

  1. 25

    Vous ne pouvez pas utiliser deux fois la même liaison à un élément. Au lieu de cela, vous devez créer un calculés, qui met en forme le texte à l'aide de deux valeurs que vous souhaitez afficher.

    Par exemple (en Supposant que votre Date et Ville sont observables):

    viewModel.DateCity = ko.computed(function() {
  return viewModel.Date() + " - " + viewModel.City();
});

    Puis dans votre data-bind, vous venez de le lier à l'calculée.

    <div class="date city" data-bind="text:DateCity" />

    Une autre option est de combiner les valeurs de la liaison directement.

    <div class="date city" data-bind="text: Date() + ' - ' + City()" />

    Personnellement, je pense que l'aide de cette approche est un nettoyeur de chemin à parcourir.

  2. 6

    Vous pouvez simplement écrire :- 

    data-bind = "text: Date() + City()"

    Et si vous voulez ajouter n'importe quelle chaîne ex:- 2013-05-24 : New York , vous pouvez code :

    data-bind = "text: Date() + ':' + City()"

    De cette façon sa a fonctionné pour moi.

  3. 3

    À l'utilisation des styles différents pour chaque partie, vous aurez besoin de séparer les éléments HTML à joindre ces styles. À l'aide d'un span pour chaque partie du travail.

    <div>
    <span class="date" data-bind="text:Date"></span>
    <span class="city" data-bind="text:City" ></span>
</div>
  4. 3

    vous pouvez ajouter 2 travées ou l'appeler comme cela 

    <div class="date" data-bind="text:Date() +' '+ city()" />
  5. 1

    utiliser "," ou le signe "+" pour faire plusieurs data-bind.

    <div class="date city" data-bind=" text:Date(), text: City" />


<div class="date city" data-bind=" text:Date() + City" />
  6. 1

    Avec ko.coups de poing vous pourriez faire

    <div class='date city'>{{ Date() }} {{ City }}</div>

    Juste une autre option avec un super plugin.

  7. 0

    Essayez d'utiliser ce format: 

    data-bind="text: city() + ', ' + state() + ' ' + zipcode()"