Question

我在这里尝试使用用户信用卡登录如果用户有效，我想使用angular js将UserName，LastloginTime，Role值传递给另一个页面

<form role="form" ng-app="MyApp" ng-controller="MasterController">
        <div class="form-group">
            <label>
                Username</label>

            <input type="text" class="form-control" placeholder="Username" required ng-model="username" />
        </div>
        <div class="form-group">
            <label>
                Password</label>
            <input type="password" class="form-control" placeholder="Password" required ng-model="password" />
        </div>
        <div class="checkbox">
            <label>
                <input type="checkbox" ng-model="remember">
                Remember my Password
            </label>
        </div>
        <input type="button" value="Submit" ng-click="GetData()" class="btn btn-danger" />
        <%--<button type="button" class="btn btn-danger" ng-click="GetData()">Submit</button>--%>
        <span ng-bind="Message"></span>
    </form>

js file here

   $scope.GetData = function () {
        debugger;
        var data = { UserName: $scope.username, Password: $scope.password };
        $http.post("api/Test/CheckUsername", data)
       .success(function (data, status, headers, config) {
           if (data != "") {
               $scope.Employees = data;
               window.location.href = "EmployeeMaster";
               //$scope.Reporting = data;
           }
           else {
               alert("Invalid Credientials");
           }

       });
    }

我想在母版页中显示值

                        <table class="table">
                            <tr ng-repeat="Emp in Employees">
                                <th>User </th>
                                <td>:</td>
                                <td>{{Emp.username}}</td>
                            </tr>
                            <tr>
                                <th>Designation </th>
                                <td>:</td>
                                <td>{{Emp.RoleName}}</td>
                            </tr>
                            <tr>
                                <th>Last Login </th>
                                <td>:</td>
                                <td>{{Emp.LastLogin}}</td>
                            </tr>
                        </table>

如何将值登录页面传递到主页？

Answer 1

我建议您创建一个服务来存储您的全局数据：

myApp.controller('MyCtrl', function($scope, DataService) {
    // make your DataService available in your scope
    $scope.DataService = DataService;
});

只需将其注入所有控制器并设置和检索所需的数据：

DataService

这使您可以将模型全局绑定到print()。

Answer 2

检查角度存储A Storage是否适用于AngularJS。它非常适合存储用户信息/令牌/任何对象。

主要特点

默认情况下使用localStorage或sessionStorage，但如果它不可用，则使用ngCookies。让您保存JS对象如果保存数字，则会得到一个数字，而不是字符串使用缓存系统，这样如果你已经有了一个值，它就不会再次从商店获得它。

https://github.com/auth0/angular-storage

Answer 3

有很多方法可以实现这个目标

1）使用$ rootscope就像你使用$ scope一样

$rootscope.userName = ""

在要显示它的控制器中注入$ rootscope依赖项，并创建一个对象名称Employee并用$ rootscope填充它。

2）使用常量

module.constant("userData", data);

在要显示它的控制器中注入userData依赖项，并创建一个对象名称Employee并用userData填充它。

3）您可以使用service / factory并将数据保存在localstorage / sessionstorage

中

Answer 4

在页面之间传输数据，可以使用stateParams：在路线文件中：

 $stateProvider
  .state('employeeMasterState', {
    url: '/employeeMasterUrl/:employeeData',
    templateUrl: 'info/employeeMaster.tpl.html',
    controller: 'employeeMasterCtrl',
    controllerAs: 'employeeMasterCtrlAs'
  });

js：

$scope.GetData = function () {
    debugger;
    var data = { UserName: $scope.username, Password: $scope.password };
    $http.post("api/Test/CheckUsername", data)
   .success(function (data, status, headers, config) {
       if (data != "") {
           this.state.go('employeeMasterState',{employeeData:data}); 

       }
       else {
           alert("Invalid Credientials");
       }

   });
}

在下一页js：

constructor($scope, $statePArams){
  $scope.empData = $stateParams.data;
}

Answer 5

您可以创建服务或工厂以在网页之间共享数据。 Here is the documentation

如何使用angular js将数据一页传递到另一页？

5 个答案: