-
Notifications
You must be signed in to change notification settings - Fork 0
/
home.html
68 lines (67 loc) · 1.91 KB
/
home.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
<h1>Hello {{ $ctrl.name }}!</h1>
<p>
Actions:
<button class="button" ng-click="$ctrl.getUsers()"> Find Users!</button>
<button class="button" ng-click="$ctrl.selectedId = null;" ng-disabled="!$ctrl.selectedId">Unselect</button>
</p>
<div class="list-container">
<section class="ng1">
<h2 class="vue-heading">
AngularJS (control)
</h2>
<user-item
ng-if="$ctrl.selectedUser"
user="$ctrl.selectedUser"
selected
unselectable
></user-item>
<ul>
<li ng-repeat="user in $ctrl.users">
<user-item
user="user"
selected="user.id === $ctrl.selectedId"
ng-on-select_me="$ctrl.onSelect($event)"
></user-item>
</li>
</ul>
</section>
<section class="vue">
<h2 style="border-left: 4px solid var(--c-vue); padding-left: 8px;">
Wrapped Vue Component
</h2>
<!-- <p ng-if="$ctrl.selectedUser">
{{$ctrl.selectedUser.name}}
</p> -->
<v-user-item
ng-if="$ctrl.selectedUser"
ng-prop-user="$ctrl.selectedUser"
selected
unselectable
></v-user-item>
<ul>
<li ng-repeat="user in $ctrl.users">
<v-user-item
ng-prop-user="user"
ng-prop-selected="user.id === $ctrl.selectedId"
ng-on-select_me="$ctrl.onSelect($event)"
></v-user-item>
</li>
</ul>
</section>
<v-user-list
style="grid-area: 2 / span 2;"
ng-prop-heading_text="'Vue Component using DI'"
ng-prop-a_boolean="true"
ng-prop-a_number="1"
ng-prop-users="$ctrl.users"
></v-user-list>
<v-prop-tester
ng-prop-title="$ctrl.testProps.title"
ng-prop-likes="$ctrl.testProps.likes"
ng-prop-is_published="$ctrl.testProps.is_published"
ng-prop-comment_ids="$ctrl.testProps.comment_ids"
ng-prop-author="$ctrl.testProps.author"
ng-prop-callback="$ctrl.testProps.callback"
ng-prop-promise="$ctrl.testProps.promise"
></v-prop-tester>
</div>