En passant MVC Modèle de données à code dactylographiée côté client

Question

En passant MVC Modèle de données à code dactylographiée côté client

voix

11

Lorsque vous utilisez MVC, je passe les données du modèle du serveur au JavaScript côté client en utilisant parfois Razor injecté dans le JavaScript, comme suit:

<script type=text/javascript>
    var myClientGuid = '@Model.MyServerGuid';
</script>

Ceci définit une variable JavaScript appelée myClientGuidà la valeur de la propriété modèle côté serveur MyServerGuid. Quand il atteint le client, le code ressemble à ceci à l' intérieur du navigateur:

<script type=text/javascript>
    var myClientGuid = 'EF0077AB-0482-4D91-90A7-75285F01CA6F';
</script>

Cela permet à des fichiers JavaScript externes à utiliser cette variable.

Ma question est, dactylographiée, puisque tout le code doit être référencé via des fichiers externes, ce qui est la meilleure façon de passer les champs côté serveur à tapuscrit code? Fichiers de code externes ne peuvent pas contenir du code Razor. Dois - je utiliser la même technique que ci - dessus, dans la vue, le mélange JavaScript et Tapuscrit dans le projet?

javascript asp.net-mvc razor model typescript

Créé 09/10/2012 à 19:13
source utilisateur ChessWhiz

Dans d'autres langues...

2 réponses

voix

2

Une autre solution (pour éviter les variables globales) est d'envelopper le code d'enregistrement dans une fonction qui prend les champs côté serveur nécessaires en tant que paramètres:

Dans le fichier tapuscrit:

function setupMyPage(myGuid:string) {
   ...
}

En .cshtml:

<script src='@Url.Content("<path-to-typescript>")'></script>
<script>
    setupMyPage('@Model.MyServerGuid');
</script>

Si vous utilisez RequireJS, vous pouvez également exporter la setupMyPagefonction en tant que module, pour éviter d' ajouter la fonction de l' espace de noms global:

Dans le fichier tapuscrit:

export = setupMyPage;

En .cshtml:

<script>
    require(['@Url.Content("<path-to-typescript>")'], function(setupMyPage) {
        setupMyPage('@Model.MyServerGuid');
    };
</script>

Créé 08/08/2014 à 12:24
source utilisateur Geir Sagberg

Brian Terlson · Accepted Answer · 2012-10-09 19:19

Le compilateur dactylographiée a juste besoin de savoir que vos champs côté serveur existent. La meilleure façon de le faire est d'utiliser des déclarations ambiantes (voir l'article 10 de la spécification). Par exemple, si vous aviez un fichier .ts qui avait besoin d'utiliser myClientGuid, vous pourriez faire

declare var myClientGuid: string;

en haut de votre fichier principal .ts. Le compilateur ne génère pas de code pour cette déclaration var, de sorte que vous n'écraserait rien. Maintenant, tous les fichiers de référence que .ts fichier savoir qu'il ya une chaîne myClientGuid disponible dans le contexte global.