(docs) add angular setup

Author: antoine92190

README.md

@@ -700,37 +700,65 @@ messages: {
 
 ## Use as a Web Component
 
-### Clone vue-advance-chat project
+### Install vue-advance-chat component
 
-```bash
-git clone https://github.com/antoine92190/vue-advanced-chat.git
-```
+- Follow [Installation](#installation) steps
 
-### Build it as a Web Component
+### Install Vue.js
 
 ```bash
-npm i && npm run build:wc
-```
-
-### Add Vue.js to your application
+# Using npm
+npm install --save vue
 
-```html
-<!-- index.html -->
-<script src="https://unpkg.com/vue"></script>
+# Using yarn
+yarn add --save vue
 ```
 
-### Import the built minified component in your application
+### Angular Setup
 
-#### Add vue-advanced-chat.min.js in your application files
+```json
+// angular.json
 
-```
-vue-advanced-chat/dist/vue-advanced-chat.min.js
-```
+"build": {
+  ...
 
-#### Import the vue-advanced-chat.min.js file you just added
+  "scripts": [
+    "./node_modules/vue/dist/vue.min.js",
+    "./node_modules/vue-advanced-chat/dist/vue-advanced-chat.min.js"
+  ]
+}
+```
 
 ```javascript
-import './vue-advanced-chat.min.js'
+// page.module.ts
+
+@NgModule({
+  ...
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+})
+```
+
+```html
+<!-- page.html -->
+
+<vue-advanced-chat
+	height="100vh"
+	[currentUserId]="currentUserId"
+	[roomId]="roomId"
+	[rooms]="rooms"
+	[roomsLoaded]="true"
+	[messages]="messages"
+	[messagesLoaded]="messagesLoaded"
+	[showFiles]="true"
+	[showEmojis]="true"
+	[textFormatting]="true"
+	[showReactionEmojis]="true"
+	[showFooter]="true"
+	(fetch-messages)="fetchMessages($event.detail[0])"
+	(send-message)="sendMessage($event.detail[0])"
+	...
+>
+</vue-advanced-chat>
 ```
 
 <br>