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

Question

Hello I am very new to AngularJs. 您好，我是AngularJs的新手。 I am retrieving the HTML data from C# by calling ajax function. 我通过调用ajax函数从C＃中检索HTML数据。 Here i am trying to use the AngularJs functionality for the dynamically generated HTML. 在这里，我试图将AngularJs功能用于动态生成的HTML。 But i am not able to see any AngularJs effect on this.But AngularJs effect is working fine for static HTML.Please help me on this. 但是我看不到任何AngularJs效果。但是AngularJs效果对于静态HTML来说效果很好。请帮助我。

Below is the example. 以下是示例。

C# Code: 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 Code: myPage.aspx 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>

Script 脚本

$(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";
        }
    });
  }

});

In the above code i am retrieving the html data from c# by using ajax call and binding it to div1 . 在上面的代码中，我通过使用ajax调用从c＃中检索html数据并将其绑定到div1 。 When i try to click on John the name is not changing to Nelly. 当我尝试单击John时，名称未更改为Nelly。 Please note that Angular function worked when used in static page. 请注意，在静态页面中使用Angular函数时可以使用。

Answer 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>

Please try declaring the ng-app and ng-controller in the itself and let me know. 请尝试声明本身的ng-app和ng-controller ，让我知道。

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

问题描述

1 个解决方案

解决方案1
0 2018-03-23 10:16:46

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

问题描述

1 个解决方案

解决方案1 0 2018-03-23 10:16:46

解决方案1
0 2018-03-23 10:16:46