angular.js - AngularJS 请求 Json 并 赋值到 指令 中
仅有的幸福
仅有的幸福 2017-05-15 17:01:52
0
4
652

我在用如下方法在angular中用D3.js 画图。第一部分是实现画图功能的。涉及到directive.js写指令,controller.js中写作用域scope,在页面中写指令的p三个部分。我的问题是:在把contoller.js中的作用域scope的值放入json中访问时,无法画出相同的图形了。
首先贴上能实现画图功能,但是scope值写在本地的代码:
1、directive.js


2、controller.js

3、left.html

以上方法便能画出 angular+d3.js的图,如下~

可是,问题来了,想把controller.js 中的数据,变成$http.get("grade.json").success(function(data)这样请求的文件内的数据。

grade.json的数据如下:

会出现错误。。。

为什么呀。。

仅有的幸福
仅有的幸福

membalas semua(4)
左手右手慢动作

Memandangkan arahan digunakan, cuba gunakan skop bebas untuk mengekalkan kebebasan arahan. Dalam kes anda, anda boleh menukarnya kepada ini

.directive('linearChart', function () {
    return {
        scope: {
            chartData: '=chartData'
        },
        restrict: 'EA',
        template: '<svg width="400" height="200"></svg>',
        link: function (scope, element, attrs) {
            scope.$watch('chartData', function (newData, oldData) {
                if (!newData) return;
                drawLineChart(newData);
            });

            function drawLineChart(data) {
                //todo
            }
        }
    }
})
迷茫

Sudah selesai. . . Anda boleh mencetak salesDataToPlot anda dalam arahan untuk melihat sama ada ianya null Mesej ralat juga harus ada, untuk pemindahan data antara arahan dan pengawal, sama ada gunakan skop bebas, dan kemudian gunakan scope Parameter terikat pada nilai yang sepadan atau skop yang diwarisi digunakan.

过去多啦不再A梦

Kunci dalam fail json mestilah dalam petikan berganda

滿天的星座

Ini tidak segerak semasa permintaan $http, dan arahan itu sedang disusun apabila dom dimuatkan Pada masa itu, salesData sudah tentu tidak ditentukan.

Anda harus melakukan ini

$http.get(api)
    .then(function(res) {
        appendChart();  //这时才把指令加载到dom里去
    })

= = Ya Tuhanku, bolehkah penanya bertanya soalan tanpa terus menyiarkan tangkapan skrin kod? segmentfault menyokong sintaks penurunan harga, sayang

Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan