New: Added support for _canShowCorrectness

js/MatchingModel.js

@@ -27,6 +27,15 @@ export default class MatchingModel extends ItemsQuestionModel {
       options.push(...itemOptions);
       return options;
     }, []);
+    items.forEach(item => {
+      const itemOptions = (item._options || []);
+      item._correctAnswers = itemOptions
+        .filter(option => option._isCorrect)
+        .map(option => option.text || '')
+        .map(item => item.trim())
+        .filter(Boolean)
+        .join(', ');
+    });
     this.set({
       _items: items,
       _selectable: items.length

templates/matching.jsx

@@ -8,6 +8,7 @@ export default function Matching(props) {
     _isInteractionComplete,
     _isCorrect,
     _shouldShowMarking,
+    _canShowCorrectness,
     _isCorrectAnswerShown,
     _items,
     _options,
@@ -39,7 +40,8 @@ export default function Matching(props) {
 
         {_items.map(({
           text,
-          _index
+          _index,
+          _correctAnswers
         }, index) => {
           const activeOption = _options.find(option => (option._itemIndex === _index) && option._isActive);
           const displayItemAsCorrect = (!_isEnabled && _shouldShowMarking && (_isCorrectAnswerShown || activeOption?._shouldBeSelected));
@@ -74,6 +76,16 @@ export default function Matching(props) {
 
               </div>
 
+              {_canShowCorrectness &&
+              <div
+                key={`answer-${_index}`}
+                className="matching-item__answer-container"
+                dangerouslySetInnerHTML={{
+                  __html: (_isInteractionComplete && _canShowCorrectness && _correctAnswers) || '&nbsp;'
+                }}>
+              </div>
+              }
+
             </div>
           );
         })}