我的答案中没有真正的新答案 - 只是试图更新这个问题，并希望避免人们像我刚刚做的那样浪费一整天。
据我所知（特别是因为这个问题太老了）muted 在视频被动态添加到页面时从未工作过。由于muted 不起作用，那么muted autoplay 也不起作用。
我认为发生的情况是浏览器在页面加载时做出了某些决定，并且由于一些非常奇怪的原因，即使它具有 muted 属性，稍后添加到页面的视频也不会静音。我认为这是 Chrome 中的一个错误，在 Safari 中不会发生在我身上 - 但看起来我们现在被困住了。
Google 的 blog entry on autoplay/mute 成立仅一年，提供以下见解：
Chrome 的自动播放策略很简单：
- 始终允许静音自动播放。
- 在以下情况下允许自动播放声音：
- 用户已与域进行了交互（单击、点击等）。
- 在桌面上，用户的媒体参与指数阈值已超过，这意味着用户之前播放过视频
声音。
- 在移动设备上，用户已将网站添加到他或她的主屏幕。
- 顶级框架可以将自动播放权限委托给其 iframe 以允许自动播放声音。
只缺少一件重要的事情！
- “静音”HTML 属性仅当视频在初始加载时出现在 HTML 中时才会生效。这也适用于“自动播放静音”视频。
那么这有什么影响：
- 如果以编程方式播放没有声音的视频，则必须先将其静音。因此，如果将动态视频添加到页面，则必须在将其添加到 DOM 之后（或在播放之前）显式设置
video.muted = true。
- 如果您尝试以编程方式执行
video.play()（例如，当有人向下滚动经过静音视频并且您希望它播放时），则必须先将视频静音。
我在 Angular 中遇到了这个问题，并且花了太多时间假设它与我使用模板的事实有关，或者与 Angular 相关。
我在 StackBlitz 上制作了一个测试应用。您需要取消注释 // video.muted = true 行才能使其正常工作。
https://stackblitz.com/edit/angular-ze4t9y
要实现的其他重要事项是：
- 即使视频实际上没有声音，也必须将其静音。如果需要，请使用“bunny”视频进行测试。
- 博客中概述的较新的“媒体参与”规则可能会在测试页面时让您感到困惑，因为您将与该页面进行交互。您必须做的是关闭浏览器，或以隐身模式打开一个新窗口 - 以重置此参与规则（请参阅博客条目）。
如果您在用户没有首先“参与”页面的情况下尝试播放非静音视频，您将在浏览器中看到的错误如下所示。如果您在非静音视频中没有看到此消息，则可能是因为您与该页面进行了交互，Chrome 允许该视频播放。
最后，如果您使用的是 Angular（所有内容都是动态添加的），则可以使用以下方法使视频静音：
@ViewChild('bunnyVideo', { read: ElementRef }) bunnyVideo: ElementRef;
那么当你想玩的时候：
const video: HTMLVideoElement = this.bunnyVideo.nativeElement;
// explicitly mute it...
video.muted = true;
// ...before attempting to play
video.play().catch((err) => {
alert('video error ' + err);
});