AngularJs将数据移动到重定向页面

14 浏览
0 Comments

AngularJs将数据移动到重定向页面

我正在尝试使用在Angular中重定向的页面中的数据。

在这种情况下，我应该如何传递数据？我试过使用rootscope，但这是可取的吗？是否有任何方法可以在重定向后的页面中使用来自第一个页面的数据？

var app = angular.module('urlApp', []);
app.controller('urlCtrl', function ($scope, $log, $window) {
    $scope.ClickMeToRedirect = function () {
    $scope.myData = datafrommyDb;//这是我打算在重定向页面中使用的数据
        var url = "http://" + $window.location.host + "/Account/Login";
        $log.log(url);
        $window.location.href = url;
    };
});

0

2 答案

0 Comments

AngularJS是一个流行的JavaScript框架，用于构建动态Web应用程序。在使用AngularJS的过程中，有时会遇到将数据传递到重定向页面的问题。下面是一个关于这个问题的示例以及解决方法。

问题的出现原因是在使用angular-ui-router时，需要在.state方法中添加params属性来传递数据。具体的解决方法如下所示：

首先，在.state方法中添加params属性，并设置要传递的参数的默认值。例如：

.state("nextPage", {
    url: '/nextpage',
    templateUrl: 'app/views/next.html',
    controller: 'NextController',
    controllerAs: 'vm',
    params: {
        alpha: null,
        beta: null
    },
    data: {
        pageTitle: 'Next Page'
    }
});

然后，在当前页面中，使用$state.go方法将数据传递给重定向页面。例如：

var params = { alpha :'alpha', beta:  'beta'}
$state.go('nextPage', params);

最后，在重定向页面的控制器中，通过$state.params获取传递过来的参数，并进行相应的处理。例如：

angular
    .module('app')
    .controller('NextController', function($log, $state) {
        var vm = this;
        $log.log(' $state.params', $state.params);
        if ($state.params.alpha !== null && $state.params.beta !== null) {
            vm.whatevervariable = $state.params.alpha;
            vm.anothervariable = $state.params.beta;
        }
});

通过上述步骤，我们可以在AngularJS应用程序中成功将数据传递到重定向页面，并在重定向页面的控制器中使用这些数据。

0
0 Comments

问题的出现原因是当我们想要在不同的控制器之间共享数据时，常常会使用AngularJS的服务。服务是单例对象，可以被注入到不同的控制器中。而$rootScope并不常用，因为它对所有的控制器都是公用的，并且我们可能并不需要在所有的控制器中使用该数据。

解决方法是使用AngularJS的服务来共享数据。通过创建一个服务对象，我们可以将数据存储在这个对象中，并在需要的控制器中注入该服务对象。这样，数据就可以在不同的控制器中共享了。

以下是一些相关的链接：

- [$rootScope vs. service - Angular JS](https://stackoverflow.com/questions/16331102)

- [Share data between AngularJS controllers](https://stackoverflow.com/questions/21919962)

如果想要在AngularJS中将数据传递到重定向页面，可以使用以下方法：

首先，创建一个服务对象来存储要传递的数据：

angular.module('myApp', [])
.service('dataService', function() {
  var data = {};
  this.setData = function(newData) {
    data = newData;
  };
  this.getData = function() {
    return data;
  };
});

然后，在源页面的控制器中将数据设置到服务中：

angular.module('myApp')
.controller('SourceController', function($scope, dataService) {
  var data = {
    name: 'John',
    age: 25
  };
  dataService.setData(data);
});

接下来，在重定向页面的控制器中获取数据：

angular.module('myApp')
.controller('RedirectedController', function($scope, dataService) {
  $scope.data = dataService.getData();
});

现在，数据就可以在重定向页面的控制器中使用了。

通过使用AngularJS的服务，我们可以方便地在不同的控制器之间共享数据。这样，我们可以避免使用$rootScope来共享数据，从而提高代码的可维护性和可测试性。

0