Angular.js ng-show無法正常工作

我與Angular的ng-show有問題，我一直在尋找答案，看起來沒有任何工作。當按鈕被點擊時，我需要顯示窗體，但沒有。按鈕調用了一個其中有console.log功能和它的作品，但演出並沒有改變其狀態，這裏的代碼：Angular.js ng-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; 
    }; 
}]);

來源

2016-01-30 EDGECRUSHER

已包含在你的項目angularjs.css文件？當它假設隱藏時，元素應該有'ng-hide'類 –

你還可以嘗試'ng-if'而不是'ng-show'（這將驗證Alon的評論） – floribon

我還沒有聽說過「angularjs。 css「文件。有'ng-hide'，但是在添加'ng-show'後，整件事消失了，所以我想我需要先展示它。 – EDGECRUSHER

我假設你想要的形式是隱藏在開頭，當你點擊「顯示我」按鈕出現。

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

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

    $scope.show = false; 

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

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

編輯：當我在回答你的問題@Sunil d已與爲什麼它的行爲舉止

希望的方式其很好的解釋回答這有助於

來源

2016-01-30 23:12:44

不幸的是，這並沒有幫助，我需要通過刪除ng-hide類來做到這一點老式的方式 – EDGECRUSHER

記住，你可以使用＃1您的問題中的代碼片段&的答案。你的代碼的工作，如果你在HTML中添加「應用」部分& JS：

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>

來源

2016-01-31 00:32:54

Angular.js ng-show無法正常工作

回答

相關問題