根据文档，我在将僵尸框架实现到本地运行的 angular 应用程序中时遇到了一些问题
简单：在您的非 React 网站中，内联运行网络聊天
添加直线（非网络聊天）渠道，并生成直线机密。确保启用直线 3.0。
在您的网站上包含 botchat.css 和 botchat.js，例如：
<!DOCTYPE html>
<html>
<head>
<link href="https://cdn.botframework.com/botframework-webchat/latest/botchat.css" rel="stylesheet" />
</head>
<body>
<div id="bot"/>
<script src="https://cdn.botframework.com/botframework-webchat/latest/botchat.js"></script>
<script>
BotChat.App({
directLine: { secret: direct_line_secret },
user: { id: 'userid' },
bot: { id: 'botid' },
resize: 'detect'
}, document.getElementById("bot"));
</script>
</body>
</html>
现在我已经在标头和 js 文件中插入了构建的 CSS 的本地路径，然后在我的组件中，我声明了变量 BotChat
declare var BotChat;
然后我把脚本放在我的构造函数中
constructor() {
BotChat.App({
directLine: { secret: direct_line_secret },
user: { id: 'userid' },
bot: { id: 'botid' },
resize: 'detect'
}, document.getElementById("bot"));
}
但它似乎不起作用，因为我也在控制台中收到此错误
Loading failed for the <script> with source
“http://localhost:4200/BotFramework-WebChat-master/botchat.js”
和
Error: [object Object]
Stack trace:
resolvePromise@http://localhost:4200/polyfills.bundle.js:7633:31
任何帮助将不胜感激
在你的chatsidebar.component.ts中添加所有导入语句之后
declare var BotChat;
这实际上是打字稿的方式，告诉您在其他地方声明了一些全局变量，并且您想使用它。
声明关键字
另外，请尝试使用角度的渲染器2而不是直接的dom操作。
角度渲染器
好吧，在玩了一段时间之后，我弄清楚了。
要在现有 angular 应用程序中使用 botchat 框架，请将您从 github 下载的 botchat 文件夹放在 src 文件夹中。 在项目中的 botchat 文件夹上运行npm install和npm build。在angular.cli中链接构建的js和css文件。
在您的组件中
import { component, ViewAfterInit } from @angular/cli;
declare var BotChat; //important
然后
ngAfterViewInit(){
BotChat.App({
directLine: { secret: direct_line_secret },
user: { id: 'userid' },
bot: { id: 'botid' }, //DONT ACTUALLY PUT IN YOUR BOT ID IT WILL BREAK THE APP
resize: 'detect'
}, document.getElementById("bot"));
}
这将使它在您的 Angular 应用程序中工作。