Javascript 如何使用AngularJS指令为字符串应用css样式？

我为这个问题挣扎了好几天，不知道如何解决它

情况是：

数据库中有一个字符串为

问题

，另一个字符串为

答案

$scope.exam = {};
$timeout(function () {
    $scope.exam.QUESTION = 'Find the perimeter of a rhombus whose diagonals measure 12 and 16. <br />A.10<br />B.20  <br />C.40 <br />D.80 <br />';
    $scope.exam.ANSWER = 'D';
}, 500);

如果该选项是正确答案，则在hvr扫描中向右应用

hvr反弹。否则，应用
hvr buzz out
样式

ans = "<br /><a ng-class=\"(scope.choiceanswer === v.substring(0, 1)) ? \'hvr-bounce-in hvr-sweep-to-right\':\'hvr-buzz-out\'\">" +v +"</a>";



“严格使用”；
angular.module（'myApp'，[]）
.controller（'View2Ctrl'，函数（$scope，$timeout）{
$scope.exam={}；
$timeout（函数（）{
$scope.exam.QUESTION='找出对角线分别为12和16的菱形的周长。
a.10
B.20
C.40
D.80
；
$scope.exam.ANSWER='D'；
}, 500);
})
.directive（'choicebutton'，函数（$compile，$interpolate，$timeout）{
返回{
限制：“A”，
范围：{
选择答案：“&”，
问题:"及",，
选项类：“&”
},
替换：正确，
链接：功能（范围、元素、属性）{
范围$watch（范围、问题、功能（问题）{
若有(问题){
var结果=”；
var ans=“”；
控制台日志（问题）；
console.log（scope.choiceanswer（））；
var myArray=/（^.*？）（：）（？：）（？：）（？：）（？：）（C\s*？\.[\s\s]*？）（？：）（D\s*？\.[\s\s]*？）（？：）（0）{
console.log（v.substring（0,1））；
console.log（scope.choiceanswer（）==v.substring（0,1））；
ans=“
”+v+”；
控制台日志（ans）；
结果+=ans；
}
});
控制台日志（结果）；
$timeout（函数（）{
html（结果）；
$compile（ele.contents（））（范围）；
}, 0);
}
});
}
};
});
可能在代码片段i中简化了太多代码，但您的变体似乎非常复杂

首先，若问题总是采用这种格式，那个么您不需要在正则表达式中使用simple
split
work

第二，您生成字符串并编译它，而只需使用内置的
模板
作为指令

第三，在模板字符串中，您使用了错误的
scope
和
v
，因为您将其添加为文本，所以请尝试从
scope
中获取它，并且始终未定义


“严格使用”；
angular.module（'myApp'，[]）
.controller（'View2Ctrl'，函数（$scope，$timeout）{
$scope.exam={}；
$timeout（函数（）{
$scope.exam.QUESTION='找出对角线分别为12和16的菱形的周长。
a.10
B.20
C.40
D.80
；
$scope.exam.ANSWER='D'；
}, 500);
})
.directive（'choicebutton'，函数（$compile，$interpolate，$timeout）{
返回{
模板：“{qText}}”+
'' +
“{answer.text}”+
'',
限制：“A”，
范围：{
选择答案：“=”，
问题:"及",，
选项类：“&”
},
替换：正确，
链接：功能（范围、元素、属性）{
scope.$watch（scope.question，函数（newQuestion，oldQuestion）{
if（newQuestion==undefined | | newQuestion==oldQuestion）返回；
var q=newQuestion.split（“
”）；
scope.qText=q.shift（）；
scope.answers=q.map（功能（项目）{
返回{
所选：项[0]==scope.choiceanswer，
正文：项目
};
});
});
}
};
});


ans = "<br /><a ng-class=\"(scope.choiceanswer === v.substring(0, 1)) ? \'hvr-bounce-in hvr-sweep-to-right\':\'hvr-buzz-out\'\">" +v +"</a>";