@pravosleva/reactive-engine 1.2.2-beta → 1.2.3-beta
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +11 -18
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -90,7 +90,7 @@ export const Example001 = () => {
|
|
|
90
90
|
```vue
|
|
91
91
|
<script setup lang="ts">
|
|
92
92
|
import { AbstractService } from '@pravosleva/reactive-engine'
|
|
93
|
-
import { ReactiveEngine
|
|
93
|
+
import { ReactiveEngine } from '@pravosleva/reactive-engine/vue'
|
|
94
94
|
|
|
95
95
|
class CounterLogic extends AbstractService {
|
|
96
96
|
public counter = this.engine.signal<number>(0, 'vue-example:counter');
|
|
@@ -100,7 +100,7 @@ class CounterLogic extends AbstractService {
|
|
|
100
100
|
}
|
|
101
101
|
}
|
|
102
102
|
|
|
103
|
-
const engine = new
|
|
103
|
+
const engine = new ReactiveEngine()
|
|
104
104
|
const logic = engine.inject(CounterLogic)
|
|
105
105
|
const counter = engine.use(logic.counter)
|
|
106
106
|
</script>
|
|
@@ -109,12 +109,11 @@ const counter = engine.use(logic.counter)
|
|
|
109
109
|
<div>
|
|
110
110
|
<div>Vue 3 Signal Example</div>
|
|
111
111
|
|
|
112
|
-
<!-- Убираем .value, доверяем автоматическому развертыванию Vue -->
|
|
113
112
|
<code>{{ counter }}</code>
|
|
114
113
|
|
|
115
114
|
<div>
|
|
116
115
|
<button @click="logic.inc">
|
|
117
|
-
INC
|
|
116
|
+
+ INC
|
|
118
117
|
</button>
|
|
119
118
|
</div>
|
|
120
119
|
</div>
|
|
@@ -126,9 +125,8 @@ const counter = engine.use(logic.counter)
|
|
|
126
125
|
```ts
|
|
127
126
|
import { Component } from '@angular/core'
|
|
128
127
|
import { AbstractService } from '@pravosleva/reactive-engine'
|
|
129
|
-
import { ReactiveEngine
|
|
128
|
+
import { ReactiveEngine } from '@pravosleva/reactive-engine/angular'
|
|
130
129
|
|
|
131
|
-
// 1. Описываем изолированную бизнес-логику (Ядро/Сервис) — код 1-в-1 как в React/Vue
|
|
132
130
|
class CounterLogic extends AbstractService {
|
|
133
131
|
public counter = this.engine.signal<number>(0, 'angular-example:counter');
|
|
134
132
|
|
|
@@ -140,29 +138,24 @@ class CounterLogic extends AbstractService {
|
|
|
140
138
|
@Component({
|
|
141
139
|
selector: 'app-counter-example',
|
|
142
140
|
standalone: true,
|
|
143
|
-
// В шаблоне Angular Signals вызываются как функции: counter()
|
|
144
141
|
template: `
|
|
145
|
-
<div
|
|
146
|
-
<div
|
|
142
|
+
<div>
|
|
143
|
+
<div>Angular 16+ Signal Example</div>
|
|
147
144
|
<code>{{ counter() }}</code>
|
|
148
|
-
<div
|
|
149
|
-
<button (click)="logic.inc()"
|
|
150
|
-
INC
|
|
145
|
+
<div>
|
|
146
|
+
<button (click)="logic.inc()">
|
|
147
|
+
+ INC
|
|
151
148
|
</button>
|
|
152
149
|
</div>
|
|
153
150
|
</div>
|
|
154
151
|
`,
|
|
155
|
-
styleUrls: [
|
|
152
|
+
styleUrls: []
|
|
156
153
|
})
|
|
157
154
|
export class AngularCounterComponent {
|
|
158
|
-
|
|
159
|
-
private engine = new ReactiveEngine4Angular();
|
|
155
|
+
private engine = new ReactiveEngine();
|
|
160
156
|
|
|
161
|
-
// 3. Внедряем сервис из DI-контейнера
|
|
162
157
|
public logic = this.engine.inject(CounterLogic);
|
|
163
158
|
|
|
164
|
-
// 4. Превращаем сигнал ядра в нативный Angular Signal через метод .use()
|
|
165
|
-
// Метод inject(DestroyRef) под капотом use() отработает корректно, так как мы находимся в фазе инициализации класса
|
|
166
159
|
public counter = this.engine.use(this.logic.counter);
|
|
167
160
|
}
|
|
168
161
|
```
|