从Javascript创建AngularJS Ng元素_Javascript_Html_Angularjs

从Javascript创建AngularJS Ng元素

javascript html angularjs

从Javascript创建AngularJS Ng元素,javascript,html,angularjs,Javascript,Html,Angularjs,我只想知道如何使用angularJS从javascript创建此文件：例如，使用如下内容： <!DOCTYPE html> <html> <head> </head> <body ng-app="myApp" ng-controller="myCtrl"> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.7/

我只想知道如何使用angularJS从javascript创建此文件：

例如，使用如下内容：

<!DOCTYPE html>
<html>
    <head>
    </head>
    <body ng-app="myApp" ng-controller="myCtrl">
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.7/angular.min.js"></script>
        <div id="Holder"></div>

        <script>
            angular.module('myApp', [])
            .controller('myCtrl', function() {
                var newdiv = document.createElement('div');
                newdiv.innerHTML = '<input type="text" ng-model="TheText">{{TheText}}';
                document.getElementById("Holder").appendChild(newdiv);
            });
        </script>
    </body>
</html>

我想你必须使用$compile或类似的东西，但我似乎没有任何效果。基本上，问题是，当我以这种方式创建ng指令时，任何ng指令都不起作用

解决方案：

使用自定义指令，此答案解决了我的问题：

<!DOCTYPE html>
<html>
    <head>
    </head>
    <body ng-app="myApp">
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.7/angular.min.js"></script>
        <div mydiv></div>

        <script>
            angular.module("myApp", [])
            .directive("mydiv", function() {
                return {
                    template: '<input type="text" ng-model="TheText">{{TheText}}'
                };
            });
        </script>
    </body>
</html>

为什么不尝试简单但功能强大的html方法：

iElement.html('<svg width="600" height="100" class="svg"></svg>');

或作为备选方案附加：

iElement.append('<svg width="600" height="100" class="svg"></svg>');

当然，还有更干净的方式：

 var elt = angular.element('<input type="text" ng-model="TheText">{{TheText}}');
 iElement.append(elt);

谢谢，利奥，请你再解释一下答案好吗？我不明白雅思是从哪里来的

 var elt = angular.element('<input type="text" ng-model="TheText">{{TheText}}');
 iElement.append(elt);