This repository has been archived by the owner on Nov 8, 2023. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
93 lines (84 loc) · 3.42 KB
/
index.html
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
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>ngconf-app</title>
<base href="/" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="icon" type="image/x-icon" href="favicon.ico" />
<script>
/**
* Create an __NGCONF_APP_SHARED_CONTEXT__ for Angular code to access
*/
window.__NGCONF_APP_SHARED_CONTEXT__ = {
_ngconfAppBootstrapped: false,
_ngconfAppBootstrappedCallbacks: [],
onNgconfAppBootstrapped: function(cb) {
this._ngconfAppBootstrappedCallbacks.push(cb);
if (this._ngconfAppBootstrapped) {
this.setNgconfAppBootstrapped();
}
},
setNgconfAppBootstrapped: function() {
this._ngconfAppBootstrapped = true;
this._ngconfAppBootstrappedCallbacks.forEach(function(cb) {
cb();
});
this._ngconfAppBootstrappedCallbacks = [];
},
_angularJsBootstrapped: false,
_angularJsBootstrappedCallbacks: [],
onAngularJSBootstrapped: function(cb) {
this._angularJsBootstrappedCallbacks.push(cb);
if (this._angularJsBootstrapped) {
this.setAngularJSBootstrapped();
}
},
setAngularJSBootstrapped: function() {
this._angularJsBootstrapped = true;
this._angularJsBootstrappedCallbacks.forEach(function(cb) {
cb();
});
this._angularJsBootstrappedCallbacks = [];
}
};
</script>
</head>
<body>
<!-- root angular app, provides the shared injector -->
<c1-ngconf-app-root></c1-ngconf-app-root>
<!--
Polyfills generated by the CLI build for ngconf-app
NOTE: We leverage the differential serving techinique of using `nomodule` to only
serve the es2015 polyfills to legacy browsers
-->
<script src="./dist/apps/ngconf-app/es2015-polyfills.js" nomodule></script>
<script src="./dist/apps/ngconf-app/polyfills.js"></script>
<!--
Polyfills related to supporting custom-elements. See: @webcomponents/custom-elements
NOTE: We need the native-shim because we downlevel our source code to ES5.
-->
<script src="./dist/apps/ngconf-app/assets/custom-elements/src/native-shim.js"></script>
<script src="./dist/apps/ngconf-app/assets/custom-elements/custom-elements.min.js"></script>
<!-- some AngularJS source to trigger lazy loading of deployable-unit bundles -->
<div ng-controller="AppController">
AngularJS controller data: `foo: {{ foo }}`
<button ng-click="onTeamAButtonClick()">Load all team-a custom elements</button>
<button ng-click="onTeamBButtonClick()">Load all team-b custom elements</button>
</div>
<style>
.team-a { background: #61d0d0; }
.team-b { background: aquamarine; }
</style>
<!-- custom elements from team-a -->
<c1-element-team-a-custom-element-one class="element team-a"></c1-element-team-a-custom-element-one>
<!-- custom elements from team-b -->
<c1-element-team-b-custom-element-one class="element team-b"></c1-element-team-b-custom-element-one>
<c1-element-team-b-custom-element-two class="element team-b"></c1-element-team-b-custom-element-two>
<!-- requirejs entrypoint -->
<script
src="./dist/apps/ngconf-app/assets/require.js"
data-main="./dist/apps/ngconf-app/assets/main-angularjs.js"
></script>
</body>
</html>