weiyu/deploy/server/docs/assets/js/b05a2477.12efd531.js

"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[8379],{4433:(n,e,s)=>{s.r(e),s.d(e,{assets:()=>r,contentTitle:()=>d,default:()=>h,frontMatter:()=>a,metadata:()=>t,toc:()=>o});const t=JSON.parse('{"id":"channel/angular","title":"Angular \u96c6\u6210\u6307\u5357","description":"\u5728 Angular \u5e94\u7528\u4e2d\u96c6\u6210\u5fae\u8bed\u5ba2\u670d\u7cfb\u7edf","source":"@site/docs/channel/angular.md","sourceDirName":"channel","slug":"/channel/angular","permalink":"/docs/docs/channel/angular","draft":false,"unlisted":false,"editUrl":"https://github.com/bytedesk/bytedesk/docs/channel/angular.md","tags":[],"version":"current","sidebarPosition":5,"frontMatter":{"title":"Angular \u96c6\u6210\u6307\u5357","sidebar_label":"Angular","sidebar_position":5,"description":"\u5728 Angular \u5e94\u7528\u4e2d\u96c6\u6210\u5fae\u8bed\u5ba2\u670d\u7cfb\u7edf"},"sidebar":"tutorialSidebar","previous":{"title":"Svelte","permalink":"/docs/docs/channel/svelte"},"next":{"title":"Nextjs","permalink":"/docs/docs/channel/nextjs"}}');var i=s(5723),l=s(6246);const a={title:"Angular \u96c6\u6210\u6307\u5357",sidebar_label:"Angular",sidebar_position:5,description:"\u5728 Angular \u5e94\u7528\u4e2d\u96c6\u6210\u5fae\u8bed\u5ba2\u670d\u7cfb\u7edf"},d=void 0,r={},o=[{value:"\u5b89\u88c5\u5305",id:"\u5b89\u88c5\u5305",level:3},{value:"\u5bfc\u5165\u7ec4\u4ef6",id:"\u5bfc\u5165\u7ec4\u4ef6",level:3},{value:"\u914d\u7f6e\u53c2\u6570",id:"\u914d\u7f6e\u53c2\u6570",level:3},{value:"\u4f7f\u7528\u7ec4\u4ef6",id:"\u4f7f\u7528\u7ec4\u4ef6",level:3},{value:"\u53ef\u7528\u65b9\u6cd5",id:"\u53ef\u7528\u65b9\u6cd5",level:3}];function c(n){const e={a:"a",code:"code",h3:"h3",img:"img",li:"li",pre:"pre",ul:"ul",...(0,l.R)(),...n.components};return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsxs)(e.ul,{children:["\n",(0,i.jsx)(e.li,{children:(0,i.jsx)(e.a,{href:"https://github.com/Bytedesk/bytedesk-web",children:"github"})}),"\n",(0,i.jsx)(e.li,{children:(0,i.jsx)(e.a,{href:"https://badge.fury.io/js/bytedesk-web",children:(0,i.jsx)(e.img,{src:"https://badge.fury.io/js/bytedesk-web.svg",alt:"npm version"})})}),"\n",(0,i.jsx)(e.li,{children:(0,i.jsx)(e.a,{href:"https://www.npmjs.com/package/bytedesk-web",children:(0,i.jsx)(e.img,{src:"https://img.shields.io/npm/dm/bytedesk-web.svg?style=flat",alt:"NPM Downloads"})})}),"\n",(0,i.jsx)(e.li,{children:(0,i.jsx)(e.a,{href:"https://www.npmjs.com/package/bytedesk-web",children:"npmjs"})}),"\n"]}),"\n",(0,i.jsx)(e.h3,{id:"\u5b89\u88c5\u5305",children:"\u5b89\u88c5\u5305"}),"\n",(0,i.jsx)(e.pre,{children:(0,i.jsx)(e.code,{className:"language-bash",children:"npm install bytedesk-web\n# \u6216\nyarn add bytedesk-web\n"})}),"\n",(0,i.jsx)(e.h3,{id:"\u5bfc\u5165\u7ec4\u4ef6",children:"\u5bfc\u5165\u7ec4\u4ef6"}),"\n",(0,i.jsx)(e.pre,{children:(0,i.jsx)(e.code,{className:"language-bash",children:"import { BytedeskAngular } from 'bytedesk-web/angular';\nimport type { BytedeskConfig } from 'bytedesk-web';\n"})}),"\n",(0,i.jsx)(e.h3,{id:"\u914d\u7f6e\u53c2\u6570",children:"\u914d\u7f6e\u53c2\u6570"}),"\n",(0,i.jsxs)(e.ul,{children:["\n",(0,i.jsx)(e.li,{children:"\u652f\u6301\u5207\u6362\u5de6\u53f3\u4fa7\u680f\uff0c\u9ed8\u8ba4\u53f3\u4fa7"}),"\n",(0,i.jsx)(e.li,{children:"\u652f\u6301\u81ea\u5b9a\u4e49\u989c\u8272\u4e3b\u9898\uff0c\u9ed8\u8ba4\u84dd\u8272"}),"\n",(0,i.jsx)(e.li,{children:"\u652f\u6301\u81ea\u5b9a\u4e49\u662f\u5426\u663e\u793a\u6c14\u6ce1\uff0c\u9ed8\u8ba4\u663e\u793a"}),"\n",(0,i.jsx)(e.li,{children:"\u652f\u6301\u81ea\u5b9a\u4e49\u56fd\u9645\u5316\u8bed\u8a00\uff0c\u9ed8\u8ba4\u4e2d\u6587"}),"\n",(0,i.jsx)(e.li,{children:"\u652f\u6301\u81ea\u5b9a\u4e49\u6df1\u8272\u6a21\u5f0f\uff0c\u9ed8\u8ba4\u6d45\u8272"}),"\n",(0,i.jsx)(e.li,{children:"\u652f\u6301\u662f\u5426\u81ea\u52a8\u5f39\u7a97\u9080\u8bf7\u5bf9\u8bdd\uff0c\u9ed8\u8ba4\u4e0d\u81ea\u52a8\u5f39\u7a97\uff0c\u5e76\u652f\u6301\u81ea\u5b9a\u4e49\u5f39\u7a97\u9080\u8bf7\u5bf9\u8bdd\u7684\u6807\u9898\u548c\u5185\u5bb9\uff0c\u5f39\u7a97\u6b21\u6570\uff0c\u65f6\u95f4\u95f4\u9694\u7b49"}),"\n"]}),"\n",(0,i.jsx)(e.pre,{children:(0,i.jsx)(e.code,{className:"language-bash",children:"const config: BytedeskConfig = {\n  placement: 'bottom-right',\n  marginBottom: 20,\n  marginSide: 20,\n  bubbleConfig: {\n    show: true,\n    icon: '\ud83d\udc4b',\n    title: 'Need help?',\n    subtitle: 'Click to chat'\n  },\n  chatConfig: {\n    org: 'df_org_uid',  // \u66ff\u6362\u4e3a\u60a8\u7684\u7ec4\u7ec7ID\n    t: \"2\",\n    sid: 'df_rt_uid'      // \u66ff\u6362\u4e3a\u60a8\u7684SID\n  }\n};\n"})}),"\n",(0,i.jsx)(e.h3,{id:"\u4f7f\u7528\u7ec4\u4ef6",children:"\u4f7f\u7528\u7ec4\u4ef6"}),"\n",(0,i.jsx)(e.pre,{children:(0,i.jsx)(e.code,{className:"language-bash",children:"const App = () => {\n  const handleInit = () => {\n    console.log('BytedeskAngular initialized');\n  };\n\n  return (\n    <div>\n      <BytedeskAngular {...config} onInit={handleInit} />\n      <button onClick={() => (window as any).bytedesk?.showChat()}>\n        \u6253\u5f00\u804a\u5929\n      </button>\n    </div>\n  );\n};\n"})}),"\n",(0,i.jsx)(e.h3,{id:"\u53ef\u7528\u65b9\u6cd5",children:"\u53ef\u7528\u65b9\u6cd5"}),"\n",(0,i.jsx)(e.pre,{children:(0,i.jsx)(e.code,{className:"language-bash",children:"# \u663e\u793a/\u9690\u85cf\u804a\u5929\u7a97\u53e3\n(window as any).bytedesk?.showChat() \n(window as any).bytedesk?.hideChat()\n\n# \u663e\u793a/\u9690\u85cf\u6309\u94ae\n(window as any).bytedesk?.showButton();\n(window as any).bytedesk?.hideButton();\n\n# \u663e\u793a/\u9690\u85cf\u6c14\u6ce1\u6d88\u606f\n(window as any).bytedesk?.showBubble();\n(window as any).bytedesk?.hideBubble();\n\n# \u663e\u793a/\u9690\u85cf\u9080\u8bf7\u5bf9\u8bdd\u6846\n(window as any).bytedesk?.showInviteDialog();\n(window as any).bytedesk?.hideInviteDialog();\n"})})]})}function h(n={}){const{wrapper:e}={...(0,l.R)(),...n.components};return e?(0,i.jsx)(e,{...n,children:(0,i.jsx)(c,{...n})}):c(n)}},6246:(n,e,s)=>{s.d(e,{R:()=>a,x:()=>d});var t=s(2155);const i={},l=t.createContext(i);function a(n){const e=t.useContext(l);return t.useMemo((function(){return"function"==typeof n?n(e):{...e,...n}}),[e,n])}function d(n){let e;return e=n.disableParentContext?"function"==typeof n.components?n.components(i):n.components||i:a(n.components),t.createElement(l.Provider,{value:e},n.children)}}}]);