• AngularJs 父子级Controller传递数据


    HTML代码

    <div ng-controller="MyAccountCtrl">  
      
       <div ng-controller="TransferCtrl">  
               .............  
      
       </div>  
      
    </div>  

    js代码

    // 子级传递数据给父级  
    // 子级传递  
    $scope.checkLoggedIn = function(type) {  
              $scope.transferType = type;  
              $scope.$emit('transfer.type', type);  
    }  
      
    // 父级接收  
    $scope.$on('transfer.type', function(event, data) {  
              $scope.transferType = data;  
            });  
            $scope.checkLoggedIn = function() {  
              var type = $scope.transferType;  
    } 

    js代码

    // 父级传递数据给子级  
    // 父级传递  
    $scope.transferType = '';  
    $scope.checkLoggedIn = function(type) {  
              $scope.transferType = type;  
              $scope.$broadcast('transfer.type', type);  
    }  
      
    // 子级接收  
    $scope.transferType = '';  
    $scope.$on('transfer.type', function(event, data) {  
              $scope.transferType = data;  
            });  
            $scope.checkLoggedIn = function() {  
              var type = $scope.transferType;  
    }  

    应用实例:未读消息的个数显示

        子级控制器js代码:

     1 $scope.messageView = function(data){
     2             $scope.currentMessage = data;
     3             ngDialog.open({
     4                 template: 'html/admin/messageView.html',
     5                 className: 'ngdialog-theme-plain custom-width-70',
     6                 scope: $scope,
     7                 cache: false,
     8                 controller: function(){
     9                     if(data.readStatus == 0){   //状态为0表示未读;
    10                         $scope.$emit('messageCount', true);  //等于0的时候触发
    11                     }
    12                 }
    13             });
    14             if (data.readStatus == 1) return;
    15             data.readStatus = 1;
    16             $http.post($scope.URL + "message/updateMessage", data).success(function(){
    17                 $scope.load();
    18             });
    19         };
    View Code

       父级控制器js代码:

     1 //未读消息个数
     2     $scope.unreadCount = function(){
     3         $scope.countForm={};
     4         $scope.userId = $scope.IPSUser.userId;
     5         $scope.countForm.userId = $scope.userId;
     6         $http.post($scope.URL+ 'message/getUnreadCount', $scope.countForm).success(function(data) {
     7             $scope.count = data.data.count;
     8         });
     9     }
    10     $scope.unreadCount(); //进入主页以后先调用一次函数,显示未读个数
    11     $scope.$on('messageCount', function(event, data) {
    12         $scope.unreadCount();
    13     });
    View Code

       直接在父级控制器js代码中用定时器控制刷新(子级js代码不要了),1s刷新一次后台数据,这样做缺点是请求次数太多

     1 $scope.unreadCount = function(){
     2         $scope.countForm={};
     3         $scope.userId = $scope.IPSUser.userId;
     4         $scope.countForm.userId = $scope.userId;
     5         $http.post($scope.URL+ 'message/getUnreadCount', $scope.countForm).success(function(data) {
     6             $scope.count = data.data.count;
     7         });
     8     };
     9     $interval(function(){
    10         $scope.unreadCount();
    11     },1000);
    View Code
  • 相关阅读:
    JS(react)里面Json、String、Map、Object之间的转换
    react里面的几个内容
    object.assign的理解
    buffers与cached的区别
    vncserver错误
    Ubuntu可视化jupyter notebook
    ubuntu可视化桌面安装问题
    素数序列的生成及其应用 Version 2.2
    demo14-修改标签里面的属性
    demo13-修改元素的内容
  • 原文地址:https://www.cnblogs.com/miny-simp/p/7266705.html
Copyright © 2020-2023  润新知