ng-mouseleaveでdivを表示し、ng-mouseleaveで同じdivを非表示にするにはどうすればいいですか？

以下のコードは、マウスの上のdivを表示しますが、マウスのleaveのdivを隠すことはありません。コードを修正するにはどうすればよいですか？ng-mouseleaveでdivを表示し、ng-mouseleaveで同じdivを非表示にするにはどうすればいいですか？

<html ng-app=""> 
<script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script> 

<center> 
    <br> 
    <p ng-model="x" ng-mouseover="x='true'" ng-mouseleave="x='false'">HOVER HERE</p> 
    <br> 
    {{x}} 
    <div ng-show="x" style="position: relative;top: 100px;left: 0px;width: 100px;height: 100px;background-color: grey;"></div> 

</center>

出典

2016-10-22 user5844653

<html ng-app=""> 
 
<script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script> 
 

 
<center> 
 
    <br> 
 
    <p ng-model="x" ng-mouseover="x=true" ng-mouseleave="x=false">HOVER HERE</p> 
 
    <br> 
 
    {{x}} 
 
    <div ng-show="x" style="position: relative;top: 100px;left: 0px;width: 100px;height: 100px;background-color: grey;"></div> 
 

 
</center>

私が作った唯一の変化はx=trueからx='true'です。（一重引用符が削除されました）。引用符があるときは、xが文字列に設定されていました。したがって、ng-show='x'を評価する場合、xは常に文字列であり、常に真理値に評価されます。

出典

2016-10-22 05:52:35 Chanthu

ng-mouseleaveでdivを表示し、ng-mouseleaveで同じdivを非表示にするにはどうすればいいですか？

答えて

関連する問題