$ on on event,将变量设置为true

时间:2014-08-05 06:57:21

标签: javascript angularjs javascript-events scope angularjs-scope

这是一个愚蠢的范围问题,我在javascript上很糟糕。很确定我不知道如何将变量的值返回到父作用域(例如,在AppCtrl中查找****)`

我有2个控制器。 AppCtrl (parent)MainCtrl (child)

<div ng-controller="AppCtrl">
  <div ng-controller="MainCtrl">
  </div>
</div>

我在MainCtrl中获取一些随机的json数据。

.controller('MainCtrl', function ($scope, $http) {

        $scope.datas = [];
        $http.jsonp('http://filltext.com/?rows=10&delay=1&fname={firstName}&callback=JSON_CALLBACK').
            success(function(data){
                $scope.datas[0] = data;
                console.log($scope.datas);
                $scope.$emit('load::1');
        });
        $http.jsonp('http://filltext.com/?rows=10&delay=2&fname={firstName}&callback=JSON_CALLBACK').
            success(function(data){
                $scope.datas[1] = data;
                console.log($scope.datas);
                $scope.$emit('load::2');
        });
        $http.jsonp('http://filltext.com/?rows=10&delay=4&fname={firstName}&callback=JSON_CALLBACK').
            success(function(data){
                $scope.datas[2] = data;
                console.log($scope.datas);
                $scope.$emit('load::3');
        });
      });

当数据成功时,我会向AppCtrl发出一条消息。

在AppCtrl上,我正在侦听已发出的消息并设置数组var load = true

.controller('AppCtrl', function ($scope, $http) {
    //*****
    var load = [];
    $scope.$on('load::1', function(){
        //how do i return this value to the var above?
        load[0] = true;
    });
    $scope.$on('load::2', function(){
        load[1] = true;

    });
    $scope.$on('load::3', function(){
        load[2] = true;
    });


    if(load[0]=== true && load[1] === true && load[2] == true) {
        console.log('loaded');
    }
});

当所有三个都设置为true时,我希望console.log注销'loaded'

2 个答案:

答案 0 :(得分:1)

如果condition只运行一次,那么你可以调用if每个$ on on listener或者组合多个listener并检查是否所有内容都被加载。两种方式是相同的。

myapp.controller('AppCtrl', function ($scope, $http) {
//*****
 var load = [];
 angular.forEach(['load::1', 'load::2', 'load::3'], function (value) {
    $scope.$on(value, function (event) {
        load.push(true);
        if (load[0] === true && load[1] === true && load[2] == true) {
            alert('loaded');
        }
    });
 });
});

Fiddle Demo

答案 1 :(得分:0)

  1. 永远不会打印出来的&#39;因为这句话只运行一次
  2. if(load[0]=== true && load[1] === true && load[2] == true) { console.log('loaded'); } 2.要在Angular中的控制器之间共享数据,最好使用服务https://docs.angularjs.org/guide/services