Question

我怀疑，我想在我的应用程序中添加一个复选框，以显示或隐藏密码输入的文本

HTML

<input type="text" ng-model="data.username" placeholder="username" value="username" class="form-control" popover="inserisci qui il tuo username" popover-trigger="focus" popover-placement="right"/><br>
<input id="pwd" type="password" ng-model="data.password" placeholder="password" value="password" class="form-control" popover="inserisci qua la tua password" popover-trigger="focus" popover-placement="right"/><br>
<input class="btn-primary btn-lg" type="submit" value="Login">
<button class="btn-warning btn-lg" type="button" ng-click="cancel()">CANCELLA</button>
<input ng-model="show" type="checkbox"><span>Show Password</span>

我需要在show上绑定一个函数，它会改变密码字段的样式或类型。在我周围搜索我找到一些话题，其中人们讨论了不可能改变类型的事实，所以我想象的唯一方法是改变字段的样式，有没有办法将密码的样式改为'没'风格？
编辑
即使我使用了Alex提出的解决方案，并且我必须说它有效，我也试图以这种方式对类型使用绑定

HTML

<input id="pwd" type="{{passwordtype}}" ng-model="data.password" placeholder="password" value="password" class="form-control" popover="inserisci qua la tua password" popover-trigger="focus" popover-placement="right"/><br>
<input ng-model='check' ng-change="show()" type="checkbox"><span>SHOW PASSWORD</span>

JS

$scope.check=false
$scope.show=function(){
    if($scope.check==false){
        $scope.check=true;
        $scope.passwordtype='text'
    }else{
        $scope.check=false;
        $scope.passwordtype='password'
    }
}

它适用于资源管理器和firefox，奇怪的是在chrome和opera上，当我希望有文本时，字段会将光盘更改为正方形，任何想法为什么？

Answer 1

你可以使用简单的魔术表演和隐藏。

示例：

<input ng-show="show" type="text" ng-model="password"> <input ng-hide="show" type="password" ng-model="password"> <input type="checkbox" ng-model="show" ng-checked="false">

实例：http://jsfiddle.net/choroshin/694f7/1/

Answer 2

您不能动态地执行它，因为IE不允许它，并且它不能用于跨浏览器兼容性。现在，如果你真的想这样做。使用angularjs的显示/隐藏功能来完成它。如果checkbox是checked其他人显示另一个，则显示一个。

使用angular将类型密码样式更改为none

2 个答案: