在 angularjs 中生成 javascript

Generate javascript in angularjs

我正在制作一个可嵌入的小部件,我需要生成一个独特的 JavaScript 片段供用户将过去复制到该网站。为简单起见,我删除了大部分代码。

小部件-generator.js

.directive('widgetGenerate',function() {
        return {
            restrict: 'AE',
            replace: true,
            templateUrl: 'embed.html', // file i need to generate
            scope: {
                "height": "@"
            }
        };
    });

embed.html

<a height='{{height}}'> // WORKS!
</a>
<script type="text/javascript">
  var something = {{height}}; // DOES NOT WORK!!!!!!!!!!!!!!!!!!!!!!
</script>

用户复制过去的页面:

<textarea>
  <widget-generate height = '300'/>
</textarea>

所需的文本输出:

 <a height='300'> </a>
 <script type="text/javascript">
    var something = 300; 
 </script>

问题是我无法像这样生成 JavaScript 部分。我如何在 angularjs 中执行此操作?

我制作了一个 JSFiddle 来帮助你找到正确的方向。

HTML

<div ng-app="myApp">
    <widget-generate height="300"></widget-generate>
</div>

JavaScript

var app = angular.module("myApp", []);

app.directive('widgetGenerate',[function() {
    return {
        restrict: 'AE',
        replace: true,
        template:   '<textarea>' + 
                      '&lt;a height="{{height}}"&gt;\r\n' +
                      '&lt;/a&gt;\r\n' +
                      '&lt;script type="text/javascript"&gt;\r\n' +
                      '\tvar something = {{height}};\r\n' +
                      '&lt;/script&gt;' +
                    '</textarea>',
        scope: {
            "height": "@"
        }
    };
}]);