这是HTML
$scope.updateUser = {};
$scope.updateUser.details = {};
$scope.updateUser.email = '';
$scope.updateUser.confirm = '';
$scope.updateUser.details.open = $stateParams.openSetting === 0;
$scope.userName = userProfile.data.firstname + ' ' + userProfile.data.surname;
$scope.userCurrentEmail = userProfile.data.email;
$scope.userContactNumber = userProfile.data.phone;
$scope.editorEnabled = false;
$scope.enableEditor = function() {
$scope.editorEnabled = true;
//$scope.email = $scope.userCurrentEmail;
$scope.phone = $scope.userContactNumber;
};
$scope.disableEditor = function() {
$scope.editorEnabled = false;
};
$scope.submit = function() {
$scope.userCurrentEmail = $scope.email;
$scope.userContactNumber = $scope.phone;
$scope.disableEditor();
};
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.min.js"></script>
<form class="updateUserDetailsForm" name="updateUser" ng-submit="updateUser.$valid && submit()" novalidate>
<a class="btn btn-default" ng-click="enableEditor()">Edit details</a>
<br />
<div class="form-group">
<label for="accountName">Account name</label>
<p>{{userName}}</p>
</div>
<div class="form-group">
<label for="currentEmail">Your current email</label>
<p>{{userCurrentEmail}}</p>
</div>
<div class="form-group">
<label for="phoneNumber" ng-hide="editorEnabled">Your phone number</label>
<p ng-hide="editorEnabled">{{userContactNumber}}</p>
</div>
<div ng-show="editorEnabled">
<div class="form-group required" ng-class="{true: 'has-error'}[submitted && updateUser.email.$invalid]">
<label for="currentEmail">Your new email <span class="required">(Required)</span>
</label>
<input type="email" name="email" class="form-control" placeholder="Please enter your email address" ng-model="email" ng-show="editorEnabled" required>
<span class="help-inline" ng-show="submitted && updateUser.email.$error.required">Please enter your new email address</span>
<span class="help-inline" ng-show="submitted && updateUser.email.$error.email">Please enter a valid email</span>
</div>
<div class="form-group required" ng-class="{true: 'has-error'}[submitted && updateUser.confirm.$invalid]">
<label for="currentEmail">Confirm your new email <span class="required">(Required)</span>
</label>
<input type="email" name="confirm" class="form-control" placeholder="Please enter your email address" ng-model="confirm" match="email" ng-show="editorEnabled" required>
<span class="help-inline" ng-show="submitted && updateUser.confirm.$error.required">Please enter your new email address</span>
<span class="help-inline" ng-show="submitted && updateUser.confirm.$error.email">Please enter a valid email</span>
<span class="help-inline" ng-show="submitted && updateUser.confirm.$error.match">Email does not match</span>
</div>
<div class="form-group" ng-class="{true: 'has-error'}[submitted && updateUser.phone.$invalid]">
<label for="phone">Phone number</label>
<input type="tel" class="form-control" placeholder="Please enter your 10 digit phone number" ng-minlength="10" ng-maxlength="10" name="phone" ng-model="phone" ng-show="editorEnabled">
<span class="help-inline" ng-show="submitted && ((updateUser.phone.$error.minlength || updateUser.phone.$error.maxlength)) ">Please enter 10 digits phone number</span>
</div>
<!-- success meesage -->
<!--<div class="alert alert-success remove-user-message" role="alert">
Your details have successfully been updated.
</div>-->
<a class="btn btn-success btn-update-user-details" ng-click="submitted=true">Update</a>
<a class="btn btn-default" ng-click="disableEditor()">Cancel</a>
</div>
</form>
其余的代码很好,但我正在努力匹配电子邮件字段,以及如何在提交或保存时更改“userCurrentEmail”和“userContactNumber”的值?伙计们能帮帮我吗?