angular.ts/index.html at master · angular-wave/angular.ts · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
<!doctype html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>AngularTS</title>
    <link rel="shortcut icon" type="image/png" href="images/favicon.ico" />
    <link
      rel="stylesheet"
      href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"
    />
    <script type="module" src="/src/index.ts"></script>
    <script>
      document.addEventListener("DOMContentLoaded", () => {
        class Demo {
          constructor(Greeter) {
            this.greeter = Greeter;
          }
        }

        class Greeter {
          constructor() {
            this.greeting = "Hello";
          }

          greet() {
            this.greeting = this.greeting + " !"
          }
        }
        window.angular
          .module("todo", [])
          .service("Greeter", Greeter)
          .controller("DemoCtrl", Demo);

        window.angular.bootstrap(document, ["todo"]);
      });
    </script>
  </head>
  <body>
    <main id="$ctrl" ng-controller="DemoCtrl as $ctrl">
      <h3>{{ $ctrl.greeter.greeting  }}</h3>
      <button ng-click="$ctrl.greeter.greet()">Greet</button>
    </main>
  </body>
</html>