时间戳

首页 > 解决方案 > AngularJS 将数据广播到 iframe

angularjs - AngularJS 将数据广播到 iframe

问题描述

如何从 index.html 获取用户名？

索引.html

{{username}}

索引控制器：

app.controller('index',function($scope,$rootScope,mainService){
    $scope.getUsername = funciton(){
        mainService.getUsername().then{
            function successCallback(response){
                $rootScope.username = response.data.username;
            }
        }
    }
})

iframe.html

{{user}}

iframe 控制器

app.controller('iframe',function($scope,$rootScope){
    $scope.user = $rootScope.username
})

但{{user}}什么也不显示

另外，我尝试通过服务发布消息，dataService.username结果是一样的。

标签： angularjs

解决方案

用于$rootScope.$broadcast引发事件，事件名称的第一个参数和用于传递参数的可选第二个参数。

app.controller('IndexController', function ($scope, $rootScope, MainService) {
    $scope.getUsername = function() {
        MainService.getUsername().then(function (response) {
            $rootScope.$broadcast('username-fetched', { username: response.data.username });
        });
    };
});

然后使用捕获另一个控制器上的事件$scope.$on。

app.controller('IframeController', function ($scope) {
    $scope.$on('username-fetched', function (event, data) {
        $scope.user = data.username;
    });
});

推荐阅读