2017-09-29 51 views
0

我目前在通過我的指令模板HTML生成此svg圖像時遇到了問題。我正在使用AngularJS,但它是用CoffeeScript編寫的。如何呈現AngularJS中對象中包含的SVG代碼

.directive 'FileOutput',() -> 

    result = 
     restrict: "A" 
     replace: true 
     transclude: true 
     scope: {item: "="} 
     template: '<div>' + 
        '<div ng-if = "item.type == \'seg\'">{{item.data}}' + 
        '</div>' 

的SVG對象的開始看起來像這樣:

<?xml version="1.0" encoding="utf-8" standalone="no"?> 
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> 
<svg width="3000px" height="3000px" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> 
<g id="bg"> 
<rect x="0" y="0" width="3000px" height="3000px" style="fill:rgb(255,255,255);"/> 

的代碼,到目前爲止,檢查傳入對象,並檢查是否項目。形式等於'賽格」。這部分工作正常。傳入對象的第二部分是item.data,其中包含所有的SVG代碼。到目前爲止,我獲得的最佳成功是在網頁上顯示原始代碼。

我不知道如何實際呈現此原始代碼中包含的圖像。

任何幫助非常感謝!

回答

0

你試過這個嗎?

template: '<div>' + 
       '<div ng-if = "item.type == \'seg\'">' + item.data + 
       '</div>'