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无法正常工作

回答

相关问题