ng-show,ng-hide在控制器外部不起作用

时间:2018-12-21 06:13:23

标签: javascript angularjs

我有两个div。 一个是添加,另一个是视图。一次显示任何一个div。我的添加按钮被放置在控制器之外。

     <input id="Button1" type="button" value="Add" onclick="AddClick()" />
 <div ng-app="myApp" ng-controller="csrControl" ng-init="viewdiv=true">
     <div id="view" ng-show="viewdiv">
         view
     </div>
     <div id="add" ng-hide="viewdiv">
        Add
     </div>
 </div>

在这里,我从外部调用了控制器,并将范围变量分配为false。该变量设置为false,但是 div无法隐藏和显示。 ng-show和ng-hide不起作用

function AddClick() {
       var $scope = 'div[ng-controller="csrControl"]';
       $scope.viewdiv = 'false';
       $scope.$apply();
    }

1 个答案:

答案 0 :(得分:2)

以下是我为了使其正常运行而进行的更改:

  • ng-app="myApp" ng-controller="csrControl"放入体内。
  • ng-init="viewdiv=true"移至$scope.viewdiv = true;

还有很多小东西。看看。

angular.module('myApp', ['myApp.controllers']);

angular.module('myApp.controllers', []).controller('csrControl', [
  '$scope', function($scope){
    $scope.viewdiv = true;
    $scope.addClick = function() {
       $scope.viewdiv = false;
    }
  }
]);
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>
</head>
<body ng-app="myApp" ng-controller="csrControl">
<input id="Button1" type="button" value="Add" ng-click="addClick()" />
 <div>
     <div id="view" ng-show="viewdiv">
         view
     </div>
     <div id="add" ng-hide="viewdiv">
        Add
     </div>
 </div>
</body>
</html>