子窗口在父窗口中调用AngularJS函数
[英]AngularJS calling function in parent window from child
问题描述
I am trying to have a multi page/window application where a dashboard page controls a list of children (windows). 
我正在尝试使用一个多页/窗口应用程序，其中的仪表板页面控制着孩子列表（窗口）。 the dashboard should be able to call functions in the children and vice versa. 仪表板应该能够调用子级中的函数，反之亦然。 In this context, i have a parent and a child html where the child fails to invoke a function in the parent page. 在这种情况下，我有一个父级和一个子级html，其中子级无法调用父级页面中的函数。 Can someone pls tell me what i am missing? 有人可以告诉我我在想什么吗？
Parent.html Parent.html
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Parent</title> <script src="https://code.angularjs.org/snapshot/angular.min.js"></script> </head> <body ng-app="submitExample"> <script> console.log(window); angular.module('submitExample', []) .controller('ExampleController', ['$scope', '$window', function($scope, $window) { $scope.list = []; $scope.text = 'hello'; $window.CallParent = function() { $scope.list = ['parent call'] console.log("parent function called"); $scope.apply(); } $scope.submit = function() { if ($scope.text) { $scope.list.push(this.text); $scope.text = ''; } }; }]); </script> <form ng-submit="submit()" ng-controller="ExampleController"> Enter text and hit enter: <input type="text" ng-model="text" name="text" /> <input type="submit" id="submit" value="Submit" /> <pre>list={{list}}</pre> <a href="javascript:void(0);" NAME="child" title=" child " onClick=window.open("child.html");>Click here to open the child window</a> </form> </body> </html>
child.html child.html
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>child</title> <script src="https://code.angularjs.org/snapshot/angular.min.js"></script> </head> <body ng-app="submitExample"> <script> console.log(window); angular.module('submitExample', []) .controller('ExampleController', ['$scope', '$window', function($scope, $window) { $scope.list = []; $scope.text = 'hello'; $scope.submit = function() { if ($scope.text) { $scope.list.push(this.text); $scope.text = ''; $window.opener.CallParent(); } }; }]); </script> <form ng-submit="submit()" ng-controller="ExampleController"> Enter text and hit enter: <input type="text" ng-model="text" name="text" /> <input type="submit" id="submit" value="Submit" /> <pre>list={{list}}</pre> </form> </body> </html>
The error seen is DOMException: Blocked a frame with origin "null" from accessing a cross-origin frame. 看到的错误是DOMException：阻止了源为“ null”的框架访问跨域框架。 at b.$scope.submit (file:///C:/temp/html/child.html:24:18) 在b。$ scope.submit（file：/// C：/temp/html/child.html：24：18）
1 个解决方案
解决方案1
0 2017-08-11 10:32:04
As far as I know, $scope.apply() does not work. 据我所知， $scope.apply()不起作用。 Try $scope.$apply() 尝试$scope.$apply()
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.