|
1 |
| -# WML Angular Components Base |
2 |
| - |
3 |
| -This content is for the 19.0.0 version. Switch to the[latest version](/Windmillcode-Angular-CDK-Docs/angular-components/wml-angular-components-base/)for up-to-date documentation. |
4 |
| - |
5 |
| -WML Angular Components Base extends the WML Components Base by integrating it with Angular-specific features and functionality. It builds on the foundation provided by the core library and adds seamless integration with Angular’s framework, making it easier to work with Angular modules, change detection, and Angular-based services like ngx-translate. |
6 |
| - |
7 |
| -While WML Components Base provides the essential UI building blocks, WML Angular Components Base enhances these components to work natively with Angular. This includes adding support for Angular’s dependency injection, change detection, routing, and lifecycle hooks. |
8 |
| - |
9 |
| - |
10 |
| - |
11 |
| -## Installation |
12 |
| - |
13 |
| -Terminal window <code><div class="ec-line"><div class="code"><span style="--0:#82AAFF;--1:#3C63B3">npm</span><span style="--0:#D6DEEB;--1:#403F53"> </span><span style="--0:#ECC48D;--1:#3C63B3">install</span><span style="--0:#D6DEEB;--1:#403F53"> </span><span style="--0:#82AAFF;--1:#3C63B3">-s</span><span style="--0:#D6DEEB;--1:#403F53"> </span><span style="--0:#82AAFF;--1:#3C63B3">--verbose</span><span style="--0:#D6DEEB;--1:#403F53"> </span><span style="--0:#ECC48D;--1:#3C63B3">@windmillcode/angular-wml-components-base</span></div></div></code> |
14 |
| - |
15 |
| -## Usage |
16 |
| - |
17 |
| - |
18 |
| - |
19 |
| -### [WMLAngularMotionUIProperty](#wml-angular-motion-ui-property) |
20 |
| - |
21 |
| -**[Decent Example](#wml-animate-ui-property-decent-example)** |
22 |
| - |
23 |
| -if you want a different animation for you animation states simply use a different keyframe mabye suffixing the keyframes with open and close for organization<iframe src="https://stackblitz.com/edit/stackblitz-starters-7bnu7v?ctl=1&embed=1&file=src%2Fmain.ts&theme=dark" style="width: 100%; height: calc(500/16 * 1em) !important;"></iframe> |
24 |
| - |
25 |
| -### WMLAngularCustomComponent |
26 |
| - |
27 |
| -**Custom Components** |
28 |
| - |
29 |
| -nearly as same as WMLCustomComponent. Refer to[WMLCustomComponent](/19.0.0/Windmillcode-Angular-CDK-Docs/intro/wml-components-base/#wml-custom-component) |
30 |
| - |
31 |
| - |
32 |
| - |
33 |
| -## References |
34 |
| - |
35 |
| - |
36 |
| - |
37 |
| -### WMLAngularMotionUIProperty |
38 |
| - |
39 |
| -Extends[WMLMotionUIProperty](/19.0.0/Windmillcode-Angular-CDK-Docs/intro/wml-components-base/#wml-motion-ui-property-reference)<table><thead><tr><th>Property</th><th>Type</th><th>Description</th></tr></thead><tbody><tr><td><code dir="auto">motionEndEvent</code></td><td><code dir="auto">Subject<WMLMotionUIPropertyState></code></td><td>Subject triggered when a motion ends.</td></tr><tr><td><code dir="auto">motionKeyFrameEvent</code></td><td><code dir="auto">Subject<string></code></td><td>Subject triggered at specific keyframes during css transitions.</td></tr></tbody></table> |
40 |
| - |
41 |
| - |
42 |
| - |
43 |
| -### WMLAngularModuleForRootProps |
44 |
| - |
45 |
| -<table><thead><tr><th>Property</th><th>Type</th><th>Description</th></tr></thead><tbody><tr><td><code dir="auto">ngxTranslateLoaderFactory</code></td><td><code dir="auto">Function</code></td><td>A function that returns a new instance of <code dir="auto">WMLNGXTranslateLoader</code>.</td></tr></tbody></table> |
46 |
| - |
47 |
| - |
48 |
| - |
49 |
| -### WMLNGXTranslateLoader |
50 |
| - |
51 |
| -<table><thead><tr><th>Property</th><th>Type</th><th>Description</th></tr></thead><tbody><tr><td><code dir="auto">i18nLocation</code></td><td><code dir="auto">(lang: string) => any</code></td><td>A function that returns the translation file or object based on the language code.</td></tr></tbody></table> |
52 |
| - |
53 |
| - |
54 |
| - |
55 |
| -### Methods |
56 |
| - |
57 |
| -<table><thead><tr><th>Method</th><th>Description</th></tr></thead><tbody><tr><td><code dir="auto">getTranslation(lang: string)</code></td><td>Fetches the translations for the given language and returns an observable with the translation data.</td></tr></tbody></table> |
58 |
| - |
59 |
| - |
60 |
| - |
61 |
| -### Functions |
62 |
| - |
63 |
| - |
64 |
| - |
65 |
| -### addCustomComponent |
66 |
| - |
67 |
| -<table><thead><tr><th>Parameter</th><th>Type</th><th>Description</th></tr></thead><tbody><tr><td><code dir="auto">vcf</code></td><td><code dir="auto">ViewContainerRef</code></td><td>Angular ViewContainerRef for creating the component.</td></tr><tr><td><code dir="auto">cpnt</code></td><td><code dir="auto">Type<any></code></td><td>Component type to be created.</td></tr><tr><td><code dir="auto">props</code></td><td><code dir="auto">any</code></td><td>Properties to be passed to the component.</td></tr><tr><td><code dir="auto">return</code></td><td><code dir="auto">ComponentRef<any></code></td><td>Returns a reference to the created component.</td></tr><tr><td>,</td><td></td><td></td></tr></tbody></table> |
68 |
| - |
69 |
| - |
70 |
| - |
71 |
| -## Changelog |
72 |
| - |
73 |
| - |
74 |
| - |
75 |
| -### v18.2.3100 [9/8/24] |
76 |
| - |
77 |
| -pulled features from seperated angular features from core library to angular-wml-components-base |
78 |
| -creating WMLAngularTestUtils,WMLAngularTestHttpHandler,WMLAngularModuleForRootProps,WMLAngularMotionUIProperty |
79 |
| -WMLAngularCustomComponent from their orginal respective part which exlude “Angular in their name” |
80 |
| - |
81 |
| -### v18.2.3100 [9/8/24] |
82 |
| - |
83 |
| -updated package to reflect the version 18.2.3 of @angular/core package |
84 |
| - |
85 |
| -### v18.2.3100 [9/8/24] |
86 |
| - |
87 |
| -updated package to reflect the version 18.2.3 of @angular/core package |
88 |
| - |
89 |
| -### v18.2.3100 [9/8/24] |
90 |
| - |
91 |
| -updated package to reflect the version 18.2.3 of @angular/core package |
92 |
| - |
93 |
| -### v18.2.3110 [9/10/24] |
94 |
| - |
95 |
| -updated package to conform with @windmillcode/angular-wml-components-base |
96 |
| - |
97 |
| -### v18.2.3111 [9/10/24] |
98 |
| - |
99 |
| -updated package to conform with @windmillcode/angular-wml-components-base |
100 |
| - |
101 |
| -### v18.2.3112 [9/10/24] |
102 |
| - |
103 |
| -updated package to conform with @windmillcode/angular-wml-components-base |
104 |
| - |
105 |
| -### v18.2.3200 [9/16/24] |
106 |
| - |
107 |
| -[UPDATE] added motionKeyFrameEvent for css transitions WMLAngularMotionUIPropertyupdated package to conform with @windmillcode/wml-components-base |
108 |
| - |
109 |
| -### v18.2.4000 [9/16/24] |
110 |
| - |
111 |
| -updated package to reflect the version 18.2.4 of @angular/core package |
112 |
| - |
113 |
| -### v18.2.4000 [9/17/24] |
114 |
| - |
115 |
| -updated package to reflect the version 18.2.4 of @angular/core package |
116 |
| - |
117 |
| -### v18.2.4100 [9/19/24] |
118 |
| - |
119 |
| -updated package to conform with @windmillcode/wml-components-base |
120 |
| - |
121 |
| -### v18.2.4200 [9/21/24] |
122 |
| - |
123 |
| -updated package to conform with @windmillcode/wml-components-base |
124 |
| - |
125 |
| -### v18.2.5001 [9/22/24] |
126 |
| - |
127 |
| -updated package to reflect the version 18.2.5 of @angular/core package |
128 |
| - |
129 |
| -### v18.2.6000 [10/1/24] |
130 |
| - |
131 |
| -updated package to reflect the version 18.2.6 of @angular/core package |
132 |
| - |
133 |
| -### v18.2.7000 [10/2/24] |
134 |
| - |
135 |
| -updated package to reflect the version 18.2.7 of @angular/core package |
136 |
| - |
137 |
| -### v18.2.7001 [10/5/24] |
138 |
| - |
139 |
| -updated package to conform with @windmillcode/wml-components-base |
140 |
| - |
141 |
| -### v18.2.7010 [10/9/24] |
142 |
| - |
143 |
| -updated package to conform with @windmillcode/wml-components-base |
144 |
| - |
145 |
| -### v18.2.7020 [10/10/2024 2:15:30 PM EST] |
146 |
| - |
147 |
| -updated package to conform with @windmillcode/wml-components-base |
148 |
| -[PATCH] <code dir="auto">WMLAngularMotionUIProperty</code> constructor got updated in <code dir="auto">projects/wml-angular-components-base/src/lib/models.ts</code> to take partial props, fixing a bug where custom props were not being overridden just know that for the time being you can only use WMLMotionUIProperty or WMLAngularMotionUIProperty you cant use both becuase internally there would be a conflict with the management of static variables between the two classes |
149 |
| - |
150 |
| -### v18.2.8000 [10/10/24] |
151 |
| - |
152 |
| -updated package to reflect the version 18.2.8 of @angular/core package |
153 |
| - |
154 |
| -### v18.2.8000 [10/11/24] |
155 |
| - |
156 |
| -updated package to reflect the version 18.2.8 of @angular/core package |
157 |
| - |
158 |
| -### v18.2.8001 [10/11/24] |
159 |
| - |
160 |
| -updated package to reflect the version 18.2.8 of @angular/core package |
161 |
| - |
162 |
| -### v18.2.8001 [10/11/24] |
163 |
| - |
164 |
| -updated package to conform with @windmillcode/wml-components-base |
165 |
| - |
166 |
| -### v18.2.9000 [10/23/24] |
167 |
| - |
168 |
| -updated package to conform with @windmillcode/wml-components-base |
169 |
| - |
170 |
| -### v18.2.10000 [10/31/24] |
171 |
| - |
172 |
| -updated package to conform with @windmillcode/wml-components-base |
173 |
| - |
174 |
| -### v18.2.11000 [11/7/24] |
175 |
| - |
176 |
| -updated package to conform with @windmillcode/wml-components-base |
177 |
| - |
178 |
| -### v18.2.12000 [11/15/24] |
179 |
| - |
180 |
| -updated package to conform with @windmillcode/wml-components-base |
181 |
| - |
182 |
| -### v18.2.12001 [11/17/24] |
183 |
| - |
184 |
| -updated package to conform with @windmillcode/wml-components-base |
185 |
| - |
186 |
| -### v19.0.0 [11/19/24] |
187 |
| - |
188 |
| -updated package to conform with @windmillcode/wml-components-base |
189 |
| - |
190 |
| -### v19.0.3 [11/20/24] |
191 |
| - |
192 |
| -updated package to conform with @windmillcode/wml-components-base |
193 |
| - |
194 |
| -### v19.0.4 [11/26/24] |
195 |
| - |
196 |
| -updated package to conform with @windmillcode/wml-components-base |
197 |
| - |
198 |
| -### v19.0.1000 [11/26/24] |
199 |
| - |
200 |
| -updated package to conform with @windmillcode/wml-components-base[](/Windmillcode-Angular-CDK-Docs/19.0.0/angular-components/wml-accordion/)[](/Windmillcode-Angular-CDK-Docs/19.0.0/angular-components/wml-button/) |
0 commit comments