Question

我有一个“位置”页面，该页面上有一些内容，最终用户单击某个位置时，它将转到新页面。我正在尝试使用相同的控制器和范围将一些数据传递到新页面，但是在新页面上它放弃了范围？

HTML：

<h3 class="fc-primary" ng-click="canvasLocation(location.id)"><a href="/about-us/location">{{location.id}}</a></h3>

角度控制器：

$scope.canvasLocation = function(locationId) {
                    angular.forEach($scope.model.canvasLocations.response.locations,
                        function(value) {
                            if (value.id === locationId ) {
                                $scope.model.canvasLocationData.push(value);
                                var tempArry = [];
                                tempArry.push(value.institutionName);
                                tempArry.push(value.latitude);
                                tempArry.push(value.longitude);
                                tempArry.push(value.mondayOpen);
                                tempArry.push(value.mondayClose);
                                tempArry.push(value.tuesdayOpen);
                                tempArry.push(value.tuesdayClose);
                                tempArry.push(value.wednesdayOpen);
                                tempArry.push(value.wednesdayClose);
                                tempArry.push(value.thursdayOpen);
                                tempArry.push(value.thursdayClose);
                                tempArry.push(value.fridayOpen);
                                tempArry.push(value.fridayClose);
                                tempArry.push(value.saturdayOpen);
                                tempArry.push(value.saturdayClose);
                                tempArry.push(value.sundayOpen);
                                tempArry.push(value.sundayClose);
                            }
                        });
                };

当我尝试在新页面上访问$scope.model.canvasLocationData返回的[]时

Answer 1

您将离开已定义范围的页面，并且在加载新页面时不再可用。您有两种选择：

在现有页面上创建一个新视图以显示/ about-us / location内容。这可能是推荐的方法，因为angularjs是单页应用程序（SPA）的框架。
您需要一种将状态传递到接收页面（关于我们的位置）的方法，以便您可以在那里重建范围。如果您可以从接收页面上的位置ID为位置补水，那可能就和（about-us / location？id = 1234或基于资源的URL：about-us / location / 1234）一样简单。您在这里的选择可能取决于中间件技术（.NET，Java，Express等）。进入新页面后，您可以解析URL以获取位置ID，以对信息进行AJAX / XHR / $ http请求。

这是ui-router的URL，这对第一个项目符号很有用。在不知道您要使用哪种中间层或技术来提供内容的情况下，很难建议使用第二种方法（新页面）的更具针对性的方法。

https://github.com/angular-ui/ui-router

AngularJS使用同一控制器将范围传递到不同的页面

1 个答案: