Question

大家好我想在angularjs（bootstrap3.3）中显示和隐藏模式弹出窗口中的div以下是我编写的代码，在页面加载时显示所需的myModal_username1但在调用控制器函数时单击提交myModal_username1应该是可见的假，其他div应该是明显的真实......但是没有发生同样的事情。

控制器代码：

angular.module('ratefastApp')
  .controller('LoginCtrl', function ($scope, Auth, $location) {
 $scope.showUser = 'true';
 $scope.x= function(form) {
 $scope.showPass = 'false';
}}

观点：

<div class="modal fade" id="myModal_username" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title" id="myModalLabel">Forgot your Username ?</h4>
      </div>
      <!-- div check -->

  <div ng-show="showUser" id="myModal_username1" class="modal-body"
 ng-include src="'views/partials/forgotstage_username.html'">      
       </div>
      <!-- div question -->

  <div ng-hide="showUser" id="myModal_username2" class="modal-body"
 ng-include src="'views/partials/forgot_username.html'">       
       </div>

    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

Answer 1

x()函数（名称非常糟糕，BTW）不会更改视图使用的showUser的值。它初始化一个名为showPass的新范围字段：

 $scope.showPass = 'false';

此外，ng-include有自己的范围，继承自控制器范围。因此，在此子范围中设置字段会将字段添加到子范围，但不会更改控制器范围中字段的值。

你也不应该使用字符串来表示布尔值。使用true和false，而不是'true'和'false'。

所以代码应该是：

$scope.visibility = {
    showUser: true
}

$scope.submit = function(form) {
    $scope.visibility.showUser = false;
}

AngularJS显示和隐藏

1 个答案: