1 | <!DOCTYPE html>
|
2 | <html lang="en">
|
3 | <head>
|
4 | <meta charset="UTF-8">
|
5 | <meta name="viewport" content="width=device-width, initial-scale=1">
|
6 | <title>Title</title>
|
7 | <link rel="stylesheet" href="//design.yyuap.com/static/uploader/css/webuploader.css">
|
8 | <link rel="stylesheet" href="//design.yyuap.com/static/uui/latest/css/font-awesome.css">
|
9 | <link rel="stylesheet" type="text/css" href="//design.yyuap.com/static/uui/latest/css/u.css">
|
10 | <link rel="stylesheet" type="text/css" href="//design.yyuap.com/static/uui/latest/css/tree.css">
|
11 | <link rel="stylesheet" type="text/css" href="//design.yyuap.com/static/uui/latest/css/grid.css">
|
12 | <style id="demo-style" media="screen">
|
13 | </style>
|
14 | </head>
|
15 | <body style="background-color: #eceff1;margin-left: 20px;width: calc(100% - 20px );">
|
16 |
|
17 | <p>First name: <input data-bind="value: firstName" /></p>
|
18 | <p>Last name: <input data-bind="value: lastName" /></p>
|
19 | <h2>Hello, <span data-bind="text: fullName"> </span>!</h2><script src="//design.yyuap.com/static/jquery/jquery-1.11.2.js"></script>
|
20 | <script src="//design.yyuap.com/static/uploader/js/webuploader.js"></script>
|
21 | <script src="//design.yyuap.com/static/knockout/knockout-3.2.0.debug.js"></script>
|
22 | <script src="//design.yyuap.com/static/uui/latest/js/u-polyfill.js"></script>
|
23 | <script src="//design.yyuap.com/static/uui/latest/js/u.js"></script>
|
24 | <script src="//design.yyuap.com/static/uui/latest/js/u-tree.js"></script>
|
25 | <script src="//design.yyuap.com/static/uui/latest/js/u-grid.js"></script>
|
26 | <script src="//design.yyuap.com/static/requirejs/require.debug.js"></script>
|
27 | <script>
|
28 |
|
29 | var ViewModel = function(first, last) {
|
30 |
|
31 | this.firstName = ko.observable(first);
|
32 | this.lastName = ko.observable(last);
|
33 |
|
34 | this.fullName = ko.pureComputed(function() {
|
35 |
|
36 | return this.firstName() + " " + this.lastName();
|
37 | }, this);
|
38 | };
|
39 |
|
40 | ko.applyBindings(new ViewModel("Planet", "Earth")); </script>
|
41 | </body>
|
42 | </html>
|