我有一个名为 error-component 的 Angular 组件。每次服务抛出错误时它都会被初始化。现在，当出现一个错误时，只有屏幕阅读器会读取错误，但如果出现多个错误，屏幕阅读器只会读取一个错误，即最后一个错误。 错误来自服务端。有时服务会抛出多个错误。
<div aria-live="polite" role="alert">
<error-component></error-component>
</div>
因此，当出现一个错误时，屏幕阅读器会读取它，但如果出现多个错误，屏幕阅读器只会读取第一个错误。
最佳答案
我在回答您的 previous question 的开头提到了这一点关于指定 role="alert"和 aria-live="polite" .
Your code sample is specifying conflicting information. Using role="alert" gives you an implicit aria-live="assertive" but you are also specifying aria-live="polite". I would recommend removing role="alert". Having aria-live="polite" is sufficient.
因此，当您为 aria-live 指定两个不同的值时，结果是未知的。假设 aria-live="assertive"优先，spec自信地说:
User agents or assistive technologies MAY choose to clear queued changes when an assertive change occurs.
因此，如果您有多个断言消息，则前一条断言消息可能会被下一条断言消息清除。 (这取决于个人辅助技术来决定。例如，JAWS 可能会清除之前的消息，但 NVDA 可能不会。)
如果您将错误消息设置为 aria-live="polite"，那么您可能会听到所有消息。这取决于页面何时刷新以及屏幕阅读器缓冲区何时更新。如果您更新 <error-component> 中的消息，屏幕阅读器缓冲区更新，然后您更新 <error-component> 中的消息再次更新屏幕阅读器缓冲区，然后当用户交互暂停时，应该读取排队的错误消息。但同样，这可能是一个时间问题。
当您收到多条错误消息时，视觉上会发生什么？您可以同时看到所有消息，还是短暂地看到一条消息然后被下一条消息覆盖？
如果创建多个视觉<error-component>元素以便您可以同时看到所有消息并且您将这些组件的容器设置为 aria-live="polite"，那么您应该听到所有错误。
关于javascript - 出现多个错误时的可访问性，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/53155782/