@bubblydoo/angular-react - npm Package Compare versions

Comparing version 0.4.4 to 0.4.5

package.json

 {
   "name": "@bubblydoo/angular-react",
-  "version": "0.4.4",
+  "version": "0.4.5",
   "license": "MIT",
@@ -5,0 +5,0 @@ "author": "Hans Otto Wirtz <[e-mail]>",

README.md

@@ -208,3 +208,3 @@ <a href="https://www.npmjs.com/package/@bubblydoo/angular-react" alt="NPM">
         [ngTemplateOutletInjector]="injector"
-      ></ng-template>
+      ></ng-container>
     </div>
@@ -308,4 +308,38 @@ `,
 
+## Usage notes
+
+### `this` is undefined when passing an Angular component method as a React prop
+
+Angular component methods are always called with the component instance as `this`. When you pass an Angular method as a prop to a React component, `this` will be `undefined`.
+
+```ts
+@Component({
+  template: `<react-wrapper [component]="Button" [props]="{ onClick }">`
+})
+class AppComponent {
+  Button = Button
+
+  onClick() {
+    console.log(this) // undefined
+  }
+}
+```
+
+You can fix it as follows:
+
+```ts
+@Component({
+  template: `<react-wrapper [component]="Button" [props]="{ onClick }">`
+})
+class AppComponent {
+  Button = Button
+
+  onClick = () => {
+    console.log(this) // AppComponent instance
+  }
+}
+```
+
 ## Further reading
 
 See this blog post for the motivation and more details: [Transitioning from Angular to React, without starting from scratch](https://dev.to/bubblydoo/transitioning-from-angular-to-react-without-starting-from-scratch-j66)

No alert changes

Improved metrics

Total package byte prevSize

315838

increased by0.61%

Lines of code

2109

increased by0.33%

Number of lines in readme file

344

increased by10.97%

No dependency changes