...
Create a REST client component definition:
Expand /rewe/templates/components/jokes.yaml
Code Block title: Jokes Client templateScript: /rewe/templates/components/jokes.ftl #modelPath: /rewe/templates/components/jokes.js renderType: freemarker class: info.magnolia.module.jsmodels.rendering.JavascriptTemplateDefinition
Create a REST client component script:
Expand /rewe/templates/components/jokes.ftl
Code Block [#assign posts = model.getPosts()!] [#assign data = {"title": "bar", "body": "hello", "userId": 1}] [#assign newPost = model.createPost(data)!] <div class="row"> <div class="col-md-12"> <h2>All posts:</h2> [#list posts as post] <h3>${post.title!}</h3> <p>${post.body!}</p> <hr/> [/#list] <h2>New post created:</h2> <h3>${newPost.title!}</h3> <p>${newPost.body!}</p> </div> </div>
Now add the Javascript Model:
Expand /rewe/templates/components/jokes.js
Code Block // load rest client lib loadScript("/javascript-model-samples/templates/js/restClient.js"); /** * Javascript model. * * @constructor */ var Model = function () { /** * See https://jsonplaceholder.typicode.com/ * * @type {string} */ var baseUrl = "https://jsonplaceholder.typicode.com"; var restClient = new RestClient(); /** * Returns all posts from the JSON Placeholder service. * * @returns {JSON object} */ this.getPosts = function () { return JSON.parse(restClient.get(baseUrl + "/posts")); }; /** * Creates new post in the JSON Placeholder service. * * @param data * @returns {JSON object} */ this.createPost = function (data) { return JSON.parse(restClient.post(baseUrl + "/posts", data)); }; } new Model();
Make that component available on some page, then add it:
Expand Code Block ~/Desktop/REWE/__DAY__TWO__/daytwo/light_modules/rewe\-> vi ../symlinktest/templates/pages/symlinky.yaml ~/Desktop/REWE/__DAY__TWO__/daytwo/light_modules/rewe\-> tail -n 2 ../symlinktest/templates/pages/symlinky.yaml jokes: id: rewe:components/jokes ~/Desktop/REWE/__DAY__TWO__/daytwo/light_modules/rewe\->
- yz
Page Turner | ||
---|---|---|
|