热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

怎么把push到空数组里面的数据转成全局变量,在函数外直接获取

想实现的方式如下html

想实现的方式如下
html

1

controller.js

1
2
3
4
5
6
7
8
9
10
11
$scope.arr = [];

$scope.test = function() {

    .....

    promise.then(function(data) {

        for(var item in items) {

            $scope.arr.push(item)

        }

    });

};

$scope.test();

console.log($scope.arr)

实现$scope.arr为全局变量,方便在diretive.js里面直接拿取。
directive.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
app.directive('pieCharts', function($http) {

    return {

        scope: {  

            id: "@",  

            legend: "=",  

            arr: "="

        },  

        restrict: 'E',  

        template: '
',  

        replace: true,  

        link: function($scope, element, attrs, controller) {

            console.log($scope);

            console.log('arr',$scope.arr);  //undefined

            $scope.arr = [...];

            var option = {

                title : {

                    text: '某站点用户访问来源',

                    left:'40%',

                    top:'5%',

                    textStyle:{

                        fontSize:'10',

                        fontWeight:'normal'

                    }

                },  

                tooltip : {

                    trigger: 'item',

                    formatter: "{a}
{b} : {c} ({d}%)"

                },

                color:['#BEF1BE','#3CCFCF','#FBD5FB'],

                legend: {

                    orient: 'vertical',

                    right: '5%',

                    top:'30%',

                    itemWidth:10,

                    itemHeight:10,  

                    data: $scope.legend

                },

                // 数据内容数组  

                series: function(){  

                    var serie = [];

                    var datas = [];

                    for(var i=0;i<$scope.legend.length;i++){

                        var items = {value:$scope.arr[i], name:$scope.legend[i]};

                        datas.push(items);

                    }

                    var item = {  

                        name: '访问来源',  

                        type: 'pie',

                        radius : '55%',

                        center: ['50%', '60%'],

                        data: datas,

                        itemStyle: {

                            emphasis: {

                                shadowBlur: 10,

                                shadowOffsetX: 0,

                                shadowColor: 'rgba(0, 0, 0, 0.5)'

                            }

                        }  

                    };  

                    serie.push(item);

                    return serie;

                }()  

            };

            var pieChart = echarts.init(document.getElementById($scope.id),'macarons');  

            pieChart.setOption(option);  

            window.Onresize= pieChart.resize;

        }  

    }

});

在指令里面打印的结果却是
图片描述

不明白其实把数据push到arr里面其实在指令里面打印$scope是有arr数据的,但是专门打印$scope.arr却报undefind,是否是执行顺序的原因,还是?


推荐阅读
  • 如何在HTML中获取鼠标的当前位置
    本文介绍了在HTML中获取鼠标当前位置的三种方法,分别是相对于屏幕的位置、相对于窗口的位置以及考虑了页面滚动因素的位置。通过这些方法可以准确获取鼠标的坐标信息。 ... [详细]
  • 本文介绍了C#中数据集DataSet对象的使用及相关方法详解,包括DataSet对象的概述、与数据关系对象的互联、Rows集合和Columns集合的组成,以及DataSet对象常用的方法之一——Merge方法的使用。通过本文的阅读,读者可以了解到DataSet对象在C#中的重要性和使用方法。 ... [详细]
  • 单页面应用 VS 多页面应用的区别和适用场景
    本文主要介绍了单页面应用(SPA)和多页面应用(MPA)的区别和适用场景。单页面应用只有一个主页面,所有内容都包含在主页面中,页面切换快但需要做相关的调优;多页面应用有多个独立的页面,每个页面都要加载相关资源,页面切换慢但适用于对SEO要求较高的应用。文章还提到了两者在资源加载、过渡动画、路由模式和数据传递方面的差异。 ... [详细]
  • vue使用
    关键词: ... [详细]
  • GetWindowLong函数
    今天在看一个代码里头写了GetWindowLong(hwnd,0),我当时就有点费解,靠,上网搜索函数原型说明,死活找不到第 ... [详细]
  • Html5-Canvas实现简易的抽奖转盘效果
    本文介绍了如何使用Html5和Canvas标签来实现简易的抽奖转盘效果,同时使用了jQueryRotate.js旋转插件。文章中给出了主要的html和css代码,并展示了实现的基本效果。 ... [详细]
  • 本文介绍了在wepy中运用小顺序页面受权的计划,包含了用户点击作废后的从新受权计划。 ... [详细]
  • 模板引擎StringTemplate的使用方法和特点
    本文介绍了模板引擎StringTemplate的使用方法和特点,包括强制Model和View的分离、Lazy-Evaluation、Recursive enable等。同时,还介绍了StringTemplate语法中的属性和普通字符的使用方法,并提供了向模板填充属性的示例代码。 ... [详细]
  • JavaScript和HTML之间的交互是经由过程事宜完成的。事宜:文档或浏览器窗口中发作的一些特定的交互霎时。能够运用侦听器(或处置惩罚递次来预订事宜),以便事宜发作时实行相应的 ... [详细]
  • 用Vue实现的Demo商品管理效果图及实现代码
    本文介绍了一个使用Vue实现的Demo商品管理的效果图及实现代码。 ... [详细]
  • android listview OnItemClickListener失效原因
    最近在做listview时发现OnItemClickListener失效的问题,经过查找发现是因为button的原因。不仅listitem中存在button会影响OnItemClickListener事件的失效,还会导致单击后listview每个item的背景改变,使得item中的所有有关焦点的事件都失效。本文给出了一个范例来说明这种情况,并提供了解决方法。 ... [详细]
  • 本文介绍了Oracle存储过程的基本语法和写法示例,同时还介绍了已命名的系统异常的产生原因。 ... [详细]
  • 本文介绍了在MFC下利用C++和MFC的特性动态创建窗口的方法,包括继承现有的MFC类并加以改造、插入工具栏和状态栏对象的声明等。同时还提到了窗口销毁的处理方法。本文详细介绍了实现方法并给出了相关注意事项。 ... [详细]
  • 图像因存在错误而无法显示 ... [详细]
  • 本文详细介绍了使用C#实现Word模版打印的方案。包括添加COM引用、新建Word操作类、开启Word进程、加载模版文件等步骤。通过该方案可以实现C#对Word文档的打印功能。 ... [详细]
author-avatar
mobiledu2502884213
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有