Question

以下代码包含2个视图，我想从索引到用户获取数据。

JS代码：

var app=angular.module("myApp",[]);

app.controller("MainController",function($scope,$window,$rootScope)
{
    $rootScope.loc={UserName:"",Pwd:""};
    $scope.name="";
    $scope.check=function()
    {
        $scope.name=$rootScope.loc.UserName;

        if(($rootScope.loc.UserName !="") && ($rootScope.loc.Pwd!=""))
        {
            alert($scope.name);
            $window.location = 'user.html'
        }
    }
});

main.html中

Name: <input type="text" ng-model="loc.UserName">
Pwd: <input type="text" ng-model="loc.Pwd">
<br><br>
<input type="submit" id="submit" value="Award me" ng-click="check()">

user.html

<h1 id="honor" ng-controller="MainController">{{name}}!!!!</h1>

Answer 1

建议不要使用 $rootScope ，您可以使用角度 service 来执行此操作。

创建一个包含模型变量的服务。

angular.service("dataService", function() {
    this.value1 = "";  
});

然后您可以在控制器中引用该服务，

angular.controller("myCntrl1", function($scope, dataService) {
    $scope.dataService = dataService;
});


angular.controller("myCntrl2", function($scope, dataService) {
    $scope.dataService = dataService;
});

Answer 2

我们可以在控制器之间创建service到set和get数据，然后将该服务注入我们想要使用它的控制器函数中。

服务：

app.service('setGetData', function() {
  var data = '';
    getData: function() { return data; },
    setData: function(requestData) { data = requestData; }
});

控制器：

app.controller('myCtrl1', ['setGetData',function(setGetData) {

  // To set the data from the one controller
  var data = 'Hello World !!';  
  setGetData.setData(data);

}]);

app.controller('myCtrl2', ['setGetData',function(setGetData) {

  // To get the data from the another controller  
  var res = setGetData.getData();
  console.log(res); // Hello World !!

}]);

在这里，我们可以看到myCtrl1用于setting数据，myCtrl2用于getting数据。因此，我们可以将数据从一个控制器共享到另一个控制器。

如何使用AngularJS中的一个控制器在2个视图之间传递数据

2 个答案: