Angular.js ng-show只是不起作用

Question

我對Angular的ng-show有一個問題，我到處尋找答案，似乎沒有任何工作。 我需要在單擊按鈕時顯示表單，但事實並非如此。 Button正在調用其中包含console.log函數，它可以工作，但show不會改變它的狀態，這里是代碼：

<div class="row" ng-controller="MyCtrl">
   <form ng-show="show">
     <input type="text" ng-model="name" placeholder="Name" required>
   </form>
   <a href="#"class="button large" ng-click="showAddForm()">Show Me!</a>
</div>

在app.js中：

.controller('MyCtrl', ['$scope',function($scope) {
    $scope.showAddForm = function(){
        console.log("click click");
        $scope.show = true;
    }; 
}]);

Answer 1

我假設您希望在開頭隱藏表單，並在單擊“顯示”按鈕時顯示。

如果是這種情況，那么你的代碼就是99％。 您需要做的就是在控制器代碼的開頭將$scope.show初始化$scope.show false 。

app.controller('MyCtrl', ['$scope',function($scope) {

    $scope.show = false;

    $scope.showAddForm = function(){
        console.log("click click");
        $scope.show = true;
    }; 
}]);

請參閱插件https://plnkr.co/edit/fwVEkEQzztKgOYkLUOsK?p=preview以獲取完整的工作版本。

編輯：當我回答你的問題時@Sunil D已經回答了一個非常好的解釋，說明為什么它的行為表現方式

希望這可以幫助

Answer 2

請記住，您可以在問題和答案中使用Stackoverflow代碼段。 如果你在html＆js中添加“app”部分，你的代碼就可以了：

 angular .module("app",[]) .controller('MyCtrl', ['$scope',function($scope) { $scope.showAddForm = function(){ console.log("click click"); $scope.show = !$scope.show; }; }]); 

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="app" class="row" ng-controller="MyCtrl"> <form ng-show="show"> <input type="text" ng-model="name" placeholder="Name" required> </form> <a href="#"class="button large" ng-click="showAddForm()">Show/Hide</a> </div>