我在angular js中做了一个指令的例子。我正在使用这个指令 https://github.com/ONE-LOGIC/ngFlowchart
当我拿静态数据..显示输出请检查我的plunker http://plnkr.co/edit/d2hAhkFG0oN3HPBRS9UU?p=preview
但是当我使用$ http请求并制作相同的json对象时。不显示图表,请使用$ http请求查看我的plunker。我有与静态相同的数据对象
http://plnkr.co/edit/Vts6GdT0NNudZr2SJgVY?p=preview
$http.get('data.json').success(function(data) {
console.log(data)
var arr = data
var model={};
var new_array = []
for (var i = 0; i < arr.length; i++) {
var obj = {};
obj.name = arr[i].name;
obj.id = arr[i].id;
obj.x = arr[i].x;
obj.y = arr[i].y;
obj.color = '#000';
obj.borderColor = '#000';
var p = {};
p.type = 'flowchartConstants.bottomConnectorType';
p.id = arr[i].con_id
obj.connectors = [];
obj.connectors.push(p);
new_array.push(obj);
}
console.log('new array')
console.log(new_array)
model.nodes=new_array;
var edge = [];
for (var i = 0; i < arr.length; i++) {
if (arr[i].children.length > 0) {
for (var j = 0; j < arr[i].children.length; j++) {
var obj = {};
obj.source = arr[i].con_id;
obj.destination = arr[i].children[j].con_id;
edge.push(obj);
}
}
}
model.edges=edge;
console.log(edge)
console.log("model")
console.log(JSON.stringify(model))
$scope.flowchartselected = [];
var modelservice = Modelfactory(model, $scope.flowchartselected);
$scope.model = model;
$scope.modelservice = modelservice;
})
任何更新?
答案 0 :(得分:1)
现在正在运作。
问题是当我们第一次加载指令时它没有参数值。因此,当图表指令尝试初始化没有参数的图表时,会出现错误。所以,它将不再起作用。
如何解决问题?
只需在页面加载时给出一个伪参数。我给了假模型,
$scope.model = model;
$scope.modelservice = modelservice;
因此,首先您的图表将根据虚拟值显示图表。之后,它会使用服务器($http.get()
)