javascript - Bootstrap 'collapse in' 类未附加问题

Question

当我单击某些项目时，我遇到了 Bootstrap Collapse 选项的问题，我需要打开一些我使用了 UI-Bootstrap 的星星指令(uib-rating)

HTML:

<p class="text-align" style="cursor:pointer"><a ng-click="fnDisplayQuestions(value.quesList.quesListName,$index)" data-toggle="collapse" data-target="{{#value.quesList.quesListName}}" >{{value.quesList.quesListName}}</a></p>
<uib-rating ng-model="rate" id="{{value.quesList.quesListName}}" class="collapse" max="max" read-only="isReadonly" on-hover="rating=value" ng-click="fnPutRating(rating)" on-leave="overStar = null" titles="['one','two','three']" aria-labelledby="default-rating"></uib-rating>

这两个都在 ng-repeat 中，这里 value.quesList.quesListName 来自 ng-repeat 本身。

JS 代码:

$scope.fnDisplayQuestions = function(qListName, index) { 

        $scope.indexQList = index;
        $scope.sQList = qListName;

        if (parseInt(window.localStorage.getItem('currentRound')) == 1) {
            getCandidateInterviewListService.fnGetQuestions(qListName).then(function(response) {
                $scope.aQuestions = response;
            });
        } else {
            getCandidateInterviewListService.fnGetQuesRoundBased(qListName).then(function(response) {
                $scope.aQuestions = response;
            });
        }

}

我不知道为什么这个崩溃不能正常工作。

Answer 1

你总是可以使用 ng-if 和一些条件如下:

HTML:

<p class="text-align" style="cursor:pointer"><a ng-click="fnDisplayQuestions(value.quesList.quesListName,$index)"  >{{value.quesList.quesListName}}</a></p>
<uib-rating ng-model="rate" ng-if:"selectedQuestions" max="max" read-only="isReadonly" on-hover="rating=value" ng-click="fnPutRating(rating)" on-leave="overStar = null" titles="['one','two','three']" aria-labelledby="default-rating"></uib-rating>

JS:

$scope.fnDisplayQuestions = function(qListName, index) { 
$scope.selectedQuestions=true;          
    $scope.indexQList = index;
    $scope.sQList = qListName;
if (parseInt(window.localStorage.getItem('currentRound')) == 1) {
        getCandidateInterviewListService.fnGetQuestions(qListName).then(function(response) {
            $scope.aQuestions = response;
        });
    } else {
        getCandidateInterviewListService.fnGetQuesRoundBased(qListName).then(function(response) {
            $scope.aQuestions = response;
        });
    }