0

我在使用 c# 编程以及使用 AngularJS 方面都很陌生。我在 MyProfil 表单中有一个按钮,可以打开一个弹出窗口来更改密码。

这是 MyProfile.html 中的按钮

<a href class="btn btn-info btn-lg" data-ng-click="changePasswordDialog()"><span class="glyphicon glyphicon-pencil"></span> {{'ChangePassword' | translate}}</a>

在弹出窗口中,我有两个输入“newPassword”和“confirmPassword”以及两个按钮,一个用于保存,一个用于取消。这是 MyProfile.html 中的弹出 html 代码

`

    <div class="modal-header">
        <button type="button" class="close" ng-click="ok()"
                data-dismiss="modal" aria-hidden="true">
            &times;
        </button>
        <h2 class="form-login-heading">{{'ChangePassword' | translate}}</h2>
    </div>

    <div class="modal-body">

        <input type="Password" class="form-control" placeholder="{{'Password' | translate}}" data-ng-model="userData.newPassword" required autofocus>
        <input type="password" class="form-control" placeholder="{{'ConfirmPasssword' | translate}}" data-ng-model="userData.confirmPassword" required>          
    </div>
  <div class="wrapper">
    <a href="" class="btn btn-info btn-lg" data-ng-click="changePassword()" type="submit"><span class="glyphicon glyphicon-save"></span> {{'Save'|translate}}</a>
    <a href="" class="btn btn-primary btn-lg" data-ng-click="cancelChangePassword()"><span class="glyphicon glyphicon-remove-sign"></span> {{'Cancel' | translate}}</a>
</div>

`

在 myProfileController.js 我有

         $scope.changePasswordDialog = function () {
    $scope.userData = {
        newPassword: "",
        confirmPassword: ""
    };
    var modalInstance = $modal.open({
        templateUrl: 'modal.html',
        controller: 'ModalInstanceCtrlChangePassword',
        resolve: {
            userData: function () {
                return $scope.userData;
            }
        }
    });

    modalInstance.result.then(function (userData) {// I need to do somethig here // get the values of the inputs and send it to server sometinglike that
      $scope.selectedItem = userData;
    }, function () {
        $log.info('Modal dismissed at: ' + new Date());
    });

这是 ModalInstanceCtrlChangePassword.js,当我这样拥有它时,至少我可以看到弹出窗口“使用严格”;app.controller('ModalInstanceCtrlChangePassword', function ($scope, $modalInstance,userData) {

$scope.userData = userData;
$scope.selectedItem = {
    item: $scope.userData[0]
};

$scope.changePassword = function () {
    $modalInstance.dismiss('cancel');
};

$scope.cancelChangePassword = function () {
    $modalInstance.dismiss('cancel');

};

  });

但是,当我更改 $scope.changePassword 中的代码并调用服务时,即使弹出窗口没有显示,也没有任何效果。这是我添加调用服务后的内容:

'use strict';
app.controller('ModalInstanceCtrlChangePassword', ['$scope', '$location', 'modalService', '$cookies', function ($scope, $location, modalService, $cookies,$modalInstance ,userData) {

    $scope.userData = {
        emailwork:"",
        newPassword: "",
        confirmpassword: "",
    };

    $scope.userData = userData;
    $scope.selectedItem = {
    item: $scope.userData[0]
};

$scope.changePassword = function () {
    //$modalInstance.dismiss('cancel');
    modalService.changePassword($scope.userData).then(function (response) {
        $location.path('/home');
    },
        function (err) {
            alert("message " + err.error_description.message);
            $scope.message = err.error_description;
        });
};

$scope.cancelChangePassword = function () {
    $modalInstance.dismiss('cancel');

};

  }]);

这是 modalService.js

'user strict';

app.factory('modalService', ['$http', '$q', 'ngAuthSettings', '$cookies', function($http, $q, ngAuthSettings, $cookies) {

var serviceBase = ngAuthSettings.apiServiceBaseUri;

var modalServiceFactory = {};

var _userInfo = {
    companyId: "",
    userName: "",
    userTableId: "",
    langId: "",
    emailWork: "",
};

if ($cookies.userName && $cookies.userTableId && $cookies.companyId && $cookies.language) {

    _userInfo.userTableId = $cookies.userTableId;
    _userInfo.companyId = $cookies.companyId;
    _userInfo.userName = $cookies.userName;
    _userInfo.langId = $cookies.language;
    _userInfo.emailWork = $cookies.emailWork;
}
var _changePassword = function (userData) {

    var data = {
        // OldPassword: userData.oldPassword,
        emailWork: _userInfo.emailWork,
        NewPassword: userData.newPassword,
        ConfirmPassword: userData.confirmPassword
    };

    var deferred = $q.defer();

    $http.post(serviceBase + 'api/Account/ChangePassword', data).success(function (response) {
        //authService.logOut();
        deferred.resolve(response);
    }).error(function (err, status) {
        //authService.logOut();
        deferred.reject(err);
        alert(err.data.message);
        // authService.logOut();

    });
    return deferred.promise;
}
   modalServiceFactory.changePassword = _changePassword;
return modalServiceFactory;
}]);

这是 AccountController 中 ChangePassword 的代码

  // POST api/Account/ChangePassword
    [System.Web.Http.Route("ChangePassword")]
    public async Task<IHttpActionResult> ChangePassword(Cabin.Web.Models.ChangePasswordBindingModel model)
    {
        if (!ModelState.IsValid)
        {
            return BadRequest(ModelState);
        }

        var user = await UserManager.FindByEmailAsync(model.emailWork);
        if (user == null) return BadRequest();
        UserManager.RemovePassword(user.Id);
        var result= UserManager.AddPassword(user.Id, model.NewPassword);
        return !result.Succeeded ? GetErrorResult(result) : Ok();


        //IdentityResult result = await UserManager.ChangePasswordAsync(User.Identity.GetUserId(), model.OldPassword,
        //    model.NewPassword);
    }

我将不胜感激任何形式的指导或解决方案。谢谢

4

1 回答 1

0

请检查这篇文章,看起来你需要有类似的东西:

<div ng-include="modal.html"></div>

首先包含您的模态模板

于 2015-06-16T11:27:41.783 回答