Comment obtenir et afficher le modèle de domaine mis à jour dans Metawidgets (JavaScript) dans le client?

J'utilise Metawidgets pour javascript, et je veux accéder et afficher le modèle de domaine mis à jour si des modifications y ont été apportées, sans renvoi vers un serveur (par exemple: tous dans le même javascript côté client). Malheureusement, chaque exemple que j'ai pu trouver est retourné au serveur ou branché sur un framework.Comment obtenir et afficher le modèle de domaine mis à jour dans Metawidgets (JavaScript) dans le client?

Voici un exemple montrant mon problème avec l'obtention du modèle mis à jour. Changez les valeurs sur la page, cliquez sur «afficher» et vérifiez la fenêtre de la console. Remarquez comment cela montre encore les anciennes valeurs.

<!DOCTYPE html> 
<html> 
<head> 
    <script src="metawidget-4.1/js/lib/metawidget/core/metawidget-core.min.js" type="text/javascript"></script> 
</head> 
<body style="font-family:Arial"> 
    <div id="metawidget"></div> 
    <script type="text/javascript"> 
     var mw = new metawidget.Metawidget(document.getElementById('metawidget')); 
     mw.toInspect = { 
      name: 'X', 
      age: 40, 
      display: function(x) { 
       // This never shows the updated model if the user changes values 
       console.log(this); 
      } 
     }; 
     mw.buildWidgets(); 
    </script> 
</body> 
</html>

Comment puis-je obtenir Metawidget pour afficher automatiquement une version mise à jour de l'objet de domaine si elle a changé à partir du code? Par exemple, si je devais incrémenter l'âge (par exemple: person.age ++ ou this.age ++ dans l'affichage), la page ne reflète pas automatiquement ceci.

Source

2015-02-25 R. Barzell

Vous posez deux questions ici. Je vais y répondre séparément.

Comment puis-je obtenir Metawidget pour enregistrer les valeurs de retour des widgets dans l'objet de domaine? Pour ce faire, votre code devrait ressembler à:
```
display: function(x) { 
     mw.save(); 
     console.log(this); 
    } 
```
Comment puis-je obtenir Metawidget pour redessiner les widgets avec de nouvelles valeurs? Pour ce faire, votre code devrait ressembler à:
```
display: function(x) { 
     this.age++; 
     mw.buildWidgets(); 
    } 
```

Cependant, je dois dire la façon dont vous avez écrit ce code est un peu étrange. C'est bien si c'est juste un exemple rapide à des fins d'apprentissage, mais dans le code de production, vous voulez découpler les choses.

Par exemple, vous ne définissez généralement pas le .toInspect en ligne et vous y avez des fonctions qui référencent directement le mw.

Source

2015-02-26 21:30:51

Ne vous inquiétez pas, c'est juste un exemple rapide d'apprentissage. En fait, j'ai intentionnellement souligné le .toInspect avant de poster ici, pour garder le code le plus court possible. En outre, je suis d'accord pour ne pas référencer directement mw ... si le point ici est d'utiliser un modèle de domaine pur, l'ajout de mw force certaines préoccupations de l'interface utilisateur, ce qui va à l'encontre du but. Cependant, je peux m'inquiéter de la meilleure façon de découpler maintenant que je peux comprendre la fonctionnalité de base. –

Cool. De plus, je dois mentionner que 'mw.buildWidgets' affichera, comme vous l'avez demandé," une version mise à jour du modèle de domaine ". Donc, si votre méthode 'display' ajoute un nouveau champ' this.foo = 'bar'' qui apparaîtra aussi. Si tout ce que vous voulez faire est de mettre à jour le modèle de domaine * valeurs * (ie tous les champs/types restent les mêmes) envisager d'utiliser 'SimpleBindingProcessor.reload' –

Enfin, si vous vous sentez si enclin, je voudrais bien tirer les demandes à mon Référentiel 'Metawidget JS Examples': https://github.com/metawidget/metawidget-js –

Comment obtenir et afficher le modèle de domaine mis à jour dans Metawidgets (JavaScript) dans le client?

Répondre

Questions connexes