Question

我有一个用于更新密码的表单。 HTML：

<div class="profile-fields">

                <p>Please provide your profile details</p>

                <div class="field">
                    <label for="username">User Name</label>
                    <input type="text" name="username" value="" placeholder="UserName" ng-model="profile.name" ng-disabled="true" />
                </div>

                <div class="field">
                    <label for="password">Password:</label>
                    <input type="password" name="password"  placeholder="Password" ng-model="profile.password" value="" validator="required" required-error-message="Password is required" valid-method="watch" />
                </div>
                <div class="field">
                    <label for="password">Retype Password:</label>
                    <input type="password" name="password1" value="" placeholder="Password" ng-model="password1" validator="required" required-error-message="Password is required" valid-method="watch" />
                </div>
            </div>

使用ng-model="profile.password"

从第一个密码框发送新密码

控制器：

myApp.controller('profileController', ['$scope', 'userResolved', 'userServices', '$location', function ($scope, userResolved, userServices, $location) {

    $scope.oldPassword = userResolved.data.password;
    $scope.profile = userResolved.data;
$scope.cancelProfile = function () {


        $location.path("/dashboard");


    }
    $scope.updateProfile = function () {

        if ($scope.profileForm.$valid && $scope.profile.password == $scope.password1) {
            if ($scope.profile.password != $scope.oldPassword) {
                userServices.saveProfile($scope.profile).then(function (result) {
                    if (!result.error) {
                        alert("Profile updated!!! Please login again with new password.");
                        $location.path("/logout");
                    }
                })
                .catch(function (data) {
                    $scope.error = data.data;
                });
            }
            else {
                $scope.error = "Password cannot be same as before!!"

            }

        }
        else {
            $scope.error = "Passwords mismatch!!"
        }
    };
}]);

问题是在页面加载时，模型在第一个密码文本框中显示当前密码。用户必须手动清除第一个文本框中的当前密码才能输入新密码。我无法清除profile.password，因为我正在使用它进行验证。无论如何我们可以以不操纵ng-model的方式清除页面加载元素内部的值吗？

文本框不应在页面加载时显示当前密码。我怎样才能做到这一点？

Answer 1

创建一个新的var并为该var分配密码，然后清除模型变量。

var myPassword = profile.password;

profile.password = "";

Answer 2

我认为这会帮助您

    <input type="text"
           ng-model="params.text"
           class="form-control"
           placeholder="type something here...">
    <span ng-if="params.text"
          ng-click="clearText()"
          class="glyphicon glyphicon-remove form-control-feedback" 
          style="cursor: pointer; pointer-events: all;"
          uib-tooltip="clear">
    </span>

还有脚本：

    $scope.clearText = function() {
       $scope.params.text = null;  }

清除AngularJS中文本框内的值，而无需操纵ng-model中的数据

2 个答案: