ng-showは2回クリックしてトグルを開始します

Question

クリックに基づいてdivを表示/非表示しようとしています。ページがロードされるとき、divは意図された動作ではなく隠されていますが、トグルを開始するには2回クリックする必要があります。私はここで何が欠けていますか？

これは私のコード

<a href ng-click="ShowOrHide('01')" class="list-group-item">Night 1</a> <div ng-show="showNight">{{night}}</div> 

であり、これは問題が空ではないとして、truthyある文字列"false"へ$scope.showNightを設定していることである

var MyApp = angular.module("MyModule", []); 
MyApp .controller("MyController", function ($scope){ 
    $scope.test = "This is from angular"; 
    $scope.showNight = "false"; 
    $scope.ShowOrHide = function(night){ 
     $scope.night = "night " + night; 
     $scope.showNight = !$scope.showNight; 
    }; 

}); 

Answer 1

角度モジュールであり、文字列。 $scope.showNightをfalse（文字列ではありません）に設定した場合は修正する必要があります。

More info on truthy and falsy values in JS

Answer 2

を2回クリックした後$scope.showNightをtrueに設定boolean行きます。

$scope.showNight = false; 
      $scope.ShowOrHide = function(night) { 
       $scope.night = "night " + night; 
       $scope.showNight = !$scope.showNight; 
      }; 

Answer 3

あなたは$scope.showNight = false;の代わり$scope.showNight = "false";使用する必要があります。