如何将 angularJs 用于动态创建的 HTML（未加载到 DOM）答案

【问题标题】：How to use angularJs for dynamically created HTML(Which is not loaded to DOM)如何将 angularJs 用于动态创建的 HTML（未加载到 DOM）
【发布时间】：2018-09-01 21:40:13
【问题描述】：

您好，我对 AngularJs 很陌生。我通过调用 ajax 函数从 C# 检索 HTML 数据。在这里，我尝试将 AngularJs 功能用于动态生成的 HTML。但是我看不到任何 AngularJs 对此的影响。但是 AngularJs 效果对于静态 HTML 效果很好。请帮助我。

下面是例子。

C# 代码：

[WebMethod]
public static string DynamicHtml()
{
  StringBuilder sb=new StringBuilder();
  sb.append("    
                       <div ng-app='myApp' ng-controller='myCtrl'>
                           <h1 id='myName' ng-click='changeName()'>
                              {{firstname}}
                           </h1>
                        </div>
           "); 

  return sb.ToString();
}

HTML 代码： myPage.aspx

<html>
  <head>

      <script    src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js">
    </script>
  </head>
  <body>
    <div id="div1">
    </div>
  </body>
</html>

脚本

$(document).ready({

     $.ajax({
          type:'POST',
          content-type:'application/json;charset-4',
          url:'myPage.aspx/DynamicHtml' 
          success:function(data){

               $("#div1").html(data.d);

               ChangeNameFunc();
                 } 
          })


        function ChangeNameFunc()
        {
            var app = angular.module('myApp', []);
            app.controller('myCtrl', function ($scope) {
            $scope.firstname = "John";
            $scope.changeName = function () {
            $scope.firstname = "Nelly";
        }
    });
  }

});

在上面的代码中，我使用 ajax 调用从 c# 中检索 html 数据并将其绑定到 div1。当我尝试单击 John 时，名称不会更改为 Nelly。请注意，Angular 函数在静态页面中使用时有效。

【问题讨论】：

你必须初始化 ng-app 并在静态 DOM 中导入库文件。然后您可以向其中添加任何动态代码。有时你需要 q.apply() 代码来刷新 Angular DOM。
你能建议我怎么做吗？

标签： c# jquery angularjs angularjs-scope

【解决方案1】：

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

请尝试自行声明 ng-app 和 ng-controller 并告诉我。

【讨论】：

嗨，亚历克西斯，感谢您的回复。我正在使用多个 ng-app。所以我想动态生成一切。请以另一种方式提供给我。
我的建议最好不要使用多个 ng-app
但是，如果我们没有任何选择，那么我们该如何实现。请帮帮我