将 <audio> 标记绑定到组件 属性
Binding an <audio> tag to a component property
我正在构建一个应用程序，其中一些组件包含音频，因此我构建了一个音频组件。为简单起见，假设我们正在进行 angular 英雄之旅，并为每位英雄添加一首最喜欢的歌曲。
鉴于每个英雄都有一个 audio_path 属性（指定位置），我可以在 <audio> 标签中使用此路径并播放。但是，当在英雄之间切换时，歌曲不会停止并且音频文件不会替换（参见 https://stackblitz.com/edit/angular-toh-audio，由于某些原因声音不会播放，而在我的电脑上它完全可以）。
问题是：在同一模板的组件之间切换时 (hero1->hero2)，audio 元素不会改变。如果中间有另一个模板的另一个组件 (hero1->dragon1->hero2)，它会正确切换 audio，我假设是因为 dragon 组件不包含音频标签（dragon 没有在 blitz 上实现，但是请相信我的话）。
就像我经常无法将 audio 元素正确绑定到组件 属性（在尝试时，我收到此错误）：
ERROR Error: No value accessor for form control with unspecified name
attribute
我遇到过与 CdkDragDrop 元素类似的问题（在两个相邻组件之间导航时无法更新内容）。简单元素（文本、文本输入、单选按钮、图像）不会发生这种情况。
有什么想法吗？
第三方控件需要 ControlValueAccessor 才能使用 angular 表单。
将此添加到音频控件 ngDefaultControl。阅读更多
经过多次失败，解决方案如下：
在包含组件
[(ngModel)] 的音频元素的双向绑定
在音频组件设置中，加入如下声明：
@Component({
...
providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => AudioElementComponent),
multi: true
}
]
})
- 实现
ControlValueAccessor接口
可以找到详尽的解释here
我正在构建一个应用程序，其中一些组件包含音频，因此我构建了一个音频组件。为简单起见，假设我们正在进行 angular 英雄之旅，并为每位英雄添加一首最喜欢的歌曲。
鉴于每个英雄都有一个 audio_path 属性（指定位置），我可以在 <audio> 标签中使用此路径并播放。但是，当在英雄之间切换时，歌曲不会停止并且音频文件不会替换（参见 https://stackblitz.com/edit/angular-toh-audio，由于某些原因声音不会播放，而在我的电脑上它完全可以）。
问题是：在同一模板的组件之间切换时 (hero1->hero2)，audio 元素不会改变。如果中间有另一个模板的另一个组件 (hero1->dragon1->hero2)，它会正确切换 audio，我假设是因为 dragon 组件不包含音频标签（dragon 没有在 blitz 上实现，但是请相信我的话）。
就像我经常无法将 audio 元素正确绑定到组件 属性（在尝试时，我收到此错误）：
ERROR Error: No value accessor for form control with unspecified name attribute
我遇到过与 CdkDragDrop 元素类似的问题（在两个相邻组件之间导航时无法更新内容）。简单元素（文本、文本输入、单选按钮、图像）不会发生这种情况。
有什么想法吗？
第三方控件需要 ControlValueAccessor 才能使用 angular 表单。
将此添加到音频控件 ngDefaultControl。阅读更多
经过多次失败，解决方案如下：
在包含组件
中使用 在音频组件设置中，加入如下声明：
[(ngModel)] 的音频元素的双向绑定
@Component({
...
providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => AudioElementComponent),
multi: true
}
]
})
- 实现
ControlValueAccessor接口
可以找到详尽的解释here