angular.js - angularjs directive link append problem

Question

<p class="tab">
    <p ng-transclude class="click" ></p>
    <i class="iconfont" ng-show="show">X</i>
    <i class="iconfont" ng-show="show1">Y</i>
    <p ng-hide="show">
        <p ng-repeat="x in data" ng-click="choiceme(x)">
            {{x}}
        </p>
    </p>
</p>

link:function(scope,elem,attr){
                scope.show=true;
                scope.show1=false;
             
                scope.choiceme=function (i){
                    
                    console.log(scope.show,scope.show1);
                    scope.show1=!scope.show1;
                    scope.show =!scope.show;
                    console.log(scope.show,scope.show1);
                };
                  elem.find("p").on("click",function(){{
                    scope.show=!scope.show;
                          console.log(scope.show,scope.show1);
                    scope.$apply();
                });
            }

The current problem is very strange. The ng-click event will automatically trigger apply. However, the state of scope.show in choiceme() has indeed changed, but it is not synchronized to the Dom. Please ask for advice on this issue.

Answer 1

Look at your code, is it triggered when you click p标签的时候，应该scope.choiceme和elem.find("p").on("click"?

Is this reasonable?