如何在AngularJs中将数据从一个控制器传递到另一个控制器
如何在AngularJs中将数据从一个控制器传递到另一个控制器
我看过stack-overflow上的各种帖子,我尝试去遵循,但在创建服务时我犯了一些错误,以下是我的代码,请帮我找出错误的地方。
angular.module('yolomd', ['ngSanitize']); app.factory('myplacementdata', function () { var mydata = { placementdata: [], getplacementdataValue: function () { return mydata.placementdata; }, setplacementdataValue: function (data) { mydata.placementdata = data; } } return mydata; }); app.controller('PriorityPlacement', ['$scope', '$rootScope', 'myplacementdata', function ($scope, $rootScope, myplacementdata) { var response.Data = [{ city_name: "Toronto", city_placement_charge: "1799" }, yolomd_verify: "50"]; myplacementdata.setplacementdataValue = response.Data; console.log(myplacementdata.getplacementdataValue); //window.location = site_url + 'Overview' }]); app.controller('Overview', ['$scope', '$rootScope', '$stateParams', 'myplacementdata', function ($scope, $rootScope, myplacementdata) { console.log(myplacementdata.getplacementdataValue); }])
从上述内容中,我们可以得出以下结论:
问题的出现原因:
1. 在第一行代码中,setplacementdataValue方法的调用方式不正确,应该使用圆括号而不是等号。
2. 在第二行代码中,没有提供response.Data的来源。
解决方法:
1. 使用工厂函数代替控制器,以便在不同的控制器之间传递数据。
2. 在工厂函数中定义一个名为myplacementdata的对象,该对象包含一个placementdata数组和两个方法:getplacementdataValue和setplacementdataValue。
3. 在setplacementdataValue方法中,将传入的数据赋值给placementdata数组。
4. 在getplacementdataValue方法中,返回placementdata数组。
5. 在需要传递数据的控制器中,注入myplacementdata工厂,并使用setplacementdataValue方法将数据传递给它。
6. 在需要接收数据的控制器中,注入myplacementdata工厂,并使用getplacementdataValue方法获取数据。
以下是修正后的代码:
app.factory('myplacementdata', function () { var mydata = { placementdata: [], getplacementdataValue: function () { return mydata.placementdata; }, setplacementdataValue: function (data) { mydata.placementdata = data; } } return mydata; });
然后,在需要传递数据的控制器中:
app.controller('Controller1', function ($scope, myplacementdata) { var response = ...; // 获取response.Data的值 myplacementdata.setplacementdataValue(response.Data); });
在需要接收数据的控制器中:
app.controller('Controller2', function ($scope, myplacementdata) { var data = myplacementdata.getplacementdataValue(); console.log(data); });
这样,你就可以在不同的控制器之间成功传递数据了。
在AngularJs中,从一个控制器传递数据到另一个控制器是一个常见的需求。然而,在上述代码中,当尝试在第二个控制器中使用getplacementdataValue()方法时,会出现错误"Cannot read property 'getplacementdataValue' of undefined"。这个错误的原因是myplacementdata服务在第二个控制器中未定义。
要解决这个问题,我们需要确保myplacementdata服务在两个控制器中都可用。我们可以通过将它们添加到AngularJs应用程序的模块中来实现这一点。在上述代码中,我们可以看到应用程序模块被定义为"myApp"。我们需要确保在两个控制器中注入myplacementdata服务。
为了实现这一点,我们需要将myplacementdata服务添加到应用程序模块的依赖项中。在上述代码中,我们可以看到在控制器定义中使用了数组注入。我们只需要将'myplacementdata'添加到数组中即可。修改后的代码如下所示:
var app = angular.module("myApp", ['myplacementdata']); app.controller('PriorityPlacement', ['myplacementdata', function(myplacementdata) { myplacementdata.setplacementdataValue([1, 2, 3]); console.log(myplacementdata.getplacementdataValue()); } ]); app.controller('Overview', ['myplacementdata', function(myplacementdata) { console.log(myplacementdata.getplacementdataValue()); } ]); app.service('myplacementdata', function() { var placementdata = []; this.getplacementdataValue = function() { return placementdata; } this.setplacementdataValue = function(myplacementdata) { placementdata = myplacementdata; } })
在这个修改后的代码中,我们将'myplacementdata'服务添加到应用程序模块的依赖项中,以便在两个控制器中使用。现在,当我们尝试在第二个控制器中使用getplacementdataValue()方法时,不再会出现错误。
希望这篇文章对你理解如何在AngularJs中从一个控制器传递数据到另一个控制器有所帮助。如果你有任何疑问,请随时提问。