Use React components inside Angular
Перейти к файлу
stkevintan ab0584f9c0 fix: listener and renderer type errors 2022-12-20 19:23:42 +08:00
.circleci update node version 2022-04-07 18:16:08 +08:00
.github add stale-bot configuration (#82) 2019-01-26 20:39:53 +02:00
.vscode [Fabric] Add Dropdown component (#63) 2018-12-24 17:57:28 +02:00
apps update version 2022-04-07 14:55:38 +08:00
docs upgrade libs 2022-03-30 17:19:52 +08:00
libs fix: listener and renderer type errors 2022-12-20 19:23:42 +08:00
test fix all docs tests and run tests in CI (#100) 2019-03-17 17:40:54 +02:00
tools Upgrade all dependencies- Angular 6.1- TypeScript 2.9.2- office-ui-fabric-react 6.43.0 2018-08-02 11:16:43 +03:00
.editorconfig chore: initial commit from @angular/cli 2018-04-03 20:24:44 -07:00
.gitignore @angular/cli migration - update-gitignore 2022-03-30 14:43:44 +08:00
.prettierrc prettier formatting 2018-07-13 16:28:03 +03:00
CHANGELOG.md Release version 0.6.5 2019-05-16 10:24:47 +03:00
CODE_OF_CONDUCT.md Package upgrades, Prettier alignment (#38) 2018-12-01 21:25:27 +02:00
CONTRIBUTING.md Package upgrades, Prettier alignment (#38) 2018-12-01 21:25:27 +02:00
LICENSE Update to docs. 2018-08-16 11:23:31 -07:00
README.md Update README.md 2022-10-25 16:33:12 +08:00
angular.json 5.0.0-alpha 2022-04-06 17:40:11 +08:00
nx.json update 2022-04-07 18:08:58 +08:00
package-lock.json 5.0.0-alpha 2022-04-06 17:40:11 +08:00
package.json update 2022-04-07 18:08:58 +08:00
tsconfig.json @angular/cli migration - remove-emit-decorator-metadata 2022-03-30 14:15:45 +08:00
tsconfig.packages.json feat: remove unless config 2021-06-08 14:06:06 +08:00
tslint.json @angular/cli migration - tslint-version-6 2021-12-16 17:02:19 +08:00
yarn.lock 5.0.0-alpha 2022-04-06 17:40:11 +08:00

README.md

React support for Angular

CircleCI

Industry trends, organizational pressures, and other factors can lead to mandates regarding the use of component libraries or migration from one technology to another. In the case of Office UI Fabric, where its use is required, the client must be written in React (there is no Angular component library for the latest version). Rewrite from Angular to React may be cost-prohibitive or ill advised for other reasons.

Use of Angular-React allows consuming any React elements, but specifically Office UI Fabric, within an Angular [2+] application. The library of wrappers for Office UI Fabric simplifies the use of these components with Angular. However, any React code can make use of the custom Angular-React renderer.

Libraries

@angular-react contains two separate libraries:

  • core: npm version

    Includes the Renderer and supporting logic to render Angular components with React implementations as React components.

  • fabric: npm version

    The light-weight Angular component wrappers that expose the Fabric React component API through common Angular components (including both imperative AND declarative syntax in many cases).

angular-react@4.0 is for Angular@11

angular-react@4.1 is for Angular@13

Documentation, quick start, and guides | Demo | Contributing | StackBlitz Template | Office UI Fabric

Typical Use Cases

  • Use React component libraries with Angular
  • Incrementally rewrite an Angular application into React (moving from atomic/leaf nodes upward into full features/pages until the entire app is re-written)

Getting started

See a simple StackBlitz Template

Roadmap & Support

Both the core and fabric libraries are in production use in consumer-facing applications at Microsoft. That said, we (the team that currently maintains this project) are a product team, and @angular-react is not our primary focus. We maintain this because we need it and we share it with the wider community with the hope that it will prove useful to others. Of course, we attempt to provide help when possible and we love getting pull requests for improvements/enhancement/fixes from community members. But we don't have any specific plans for the future of this project.

Please take this in to consideration when evaluating this project's suitability for your own needs.

Contributing

If you'd like to contribute, you must follow our contributing guidelines. You can look through the issues (which should be up-to-date on who is working on which features and which pieces are blocked) and make a comment.