PlayFramework एचटीएमएल, जावास्क्रिप्ट में चर?

एक सरल खेल कार्रवाई परिभाषित PlayFramework एचटीएमएल, जावास्क्रिप्ट में चर?

def reactTest = Action { 
    request => Ok(views.html.hello("JOHN")) 
}

और hello.scala.html इस तरह दिखता है के रूप में

कल्पना कीजिए एक बुनियादी React.js उदाहरण का उपयोग:

@(name: String) 

.... 

<div id="example"></div> 
<script type="text/jsx"> 
    React.render(
    <h1>Hello, @name!</h1>,  <---- NAME PARAMETER USED HERE 
    document.getElementById('example') 
); 
</script>

यह ठीक काम करता है और परिणाम एक 'हैलो हो जाएगा जॉन! ' पृष्ठ। अब, मुझे पता है कि स्कैला कोड सर्वर पर और क्लाइंट पर जेएस कोड पर निष्पादित किया गया है, लेकिन मुझे आश्चर्य है कि @name पैरामीटर को उसी जावास्क्रिप्ट (जेएसएक्स) कोड में पास करने का कोई तरीका होगा यदि ऐसा कोड था अलग .js फ़ाइल, और <div> दिखाई देगा:

<div id="example"></div> 
<script type="text/jsx" src="@routes.Assets.at("javascripts/hello.js"></script>

वहाँ hello.js में स्क्रिप्ट के @name पैरामीटर पारित करने के लिए एक तरह से होगा?

स्रोत

2015-06-07 ticofab

यह एक अच्छा सवाल है, धन्यवाद। :) – bjfletcher

आप जो भी वैश्विक जेएस वैरिएबल में चाहते हैं उसे सहेज सकते हैं और फिर जब चाहें इसे एक्सेस कर सकते हैं।

उदाहरण के लिए, मान लीजिए कि आप अपनी स्क्रिप्ट में किसी उपयोगकर्ता ऑब्जेक्ट का उपयोग करना चाहते हैं।

(function(user) { 
    alert("Hello " + user.name + ". You are " + user.age + " years old");  
})(MyUserObject);

फिर आप इस मान का उपयोग करना चाहते का एक नक्शा का उपयोग कर या हो सकता है आपके वस्तु प्रतिपादन में सुधार कर सकते हैं: इस एचटीएमएल टेम्पलेट

@(user: User) 

<html> 
<body> 
    <script> 
     var MyUserObject = {}; 
     MyUserObject["name"] = "@user.name"; 
     MyUserObject["age"] = @user.age; 
    </script> 
    <!-- ... --> 
    <script src="your_component.js"></script> 
</body>

फिर अपने शामिल js में

आप कुछ इस तरह कर सकता है बीत रहा है JSON के रूप में और जे एस तरफ पार्स करने:

def reactTest = Action { 
    request => Ok(views.html.hello(Json.toJson(user))) 
} 

// and then 

@(user: String) 

<html> 
<body> 
    <script> 
     var MyUserObject = JSON.parse("@user"); 
    </script> 
    <!-- ... --> 
    <script src="your_component.js"></script> 
</body>

सही नहीं है, लेकिन जे एस फ़ाइलों पर प्रतिपादन कि IMO की तुलना में बेहतर।

स्रोत

2015-06-07 12:58:46 Salem

@routes... में: YourController.withModel में

@routes.YourController.withModel("javascripts/hello.js", model)

तो आप कर सकते हैं preprocess hello.js मॉडल के साथ (जैसे एक templating sbt-web प्लगइन का उपयोग कर के रूप में):

<script type="text/jsx" src="@routes.Assets.at("javascripts/hello.js"></script>

को बदला जा सकता है।

आप इस स्कैला HTML टेम्पलेट में जाने से पहले मॉडल के साथ JS वैकल्पिक रूप से पूर्व-प्रोसेस कर सकते हैं।

यदि सीपीयू/मेमोरी एक प्रमुख चिंता है, तो यह उन्नत हो सकता है: उदाहरण के लिए, पूर्व निर्धारित मॉडल और प्रीप्रोसेस्ड स्थिर JS फ़ाइलों के बीच मैपिंग, और इसके बजाय उन्हें संदर्भित करना। या अन्य कैशिंग/सीडीएन तकनीकों का उपयोग करें।

तो, ये यहां दिए गए अन्य उत्तरों के अलावा ही विचार हैं। का आनंद लें।

स्रोत

2015-06-07 13:19:45 bjfletcher

PlayFramework एचटीएमएल, जावास्क्रिप्ट में चर?

उत्तर

संबंधित मुद्दे