如何动态激活选项卡，其中包含angularjs中ui引导选项卡的内容？

Question

我想动态激活带有角度js内容的标签 我的代码是

<uib-tabset ng-if="pets_count > 0" class="petsTabs tab-animation">
    <div ng-repeat="(key, pet) in pets_list">
        <uib-tab heading="{{pet.pet_name}}" active="{{pet.pet_id == activePet}}">
            <div class="petsTabsContent" >
                <h4>
                    {{pet.pet_name}}
                    <small>
                        Boarding Dates: {{ pet.start_date | date : 'MMMM d, y'}} to {{ pet.end_date | date : 'MMMM d, y'}}
                    </small>
                </h4>
            </div>
        </uib-tab>
    </div>
</uib-tabset>

我有两个变量pet.pet_id，activePet基于这些变量我必须激活标签。 但它不起作用我是角度js的新手 提前致谢 这个控制器

$scope.show_pet_function = function () {
    var pet_id;
    var action;
    pet_id = parseInt($('.pet_view_option').attr('data-pet_id'));
    action = $('.pet_view_option').attr('data-action');
    petowner_user_id =  parseInt($('.pet_view_option').attr('data-pet-owner'));
    var details = $scope.hidePetData;
    $http.post(CONFIG.APIURL + 'Pets/changePetHideStatus/', {pet_id: pet_id, action: action})
            .then(function (response) {
                if (response.data.action == 'show_pet') {
                    promise = petlistFunction(petowner_user_id).then(function (response) {
                        $scope.activePet = pet_id;
                        angular.extend($scope.pets_list, response.data['pets_list']);
                    });
                    toastr.success(response.data.message);
                } else if (response.data.action == 'hide_pet') {
                    promise = petlistFunction(petowner_user_id).then(function (response) {
                        $scope.activePet = pet_id;
                        angular.extend($scope.pets_list, response.data['pets_list']);
                    });
                }
            });
}

这是pet_list对象类型数组的响应

Answer 1

我认为$ scope绑定可能存在问题，因为您在可用函数中提取数据。 因此，请尝试在$ http响应之后放置$scope.$apply()。 作为参考，像这样添加

angular.extend($scope.pets_list, response.data['pets_list']);
$scope.$apply();