Question

您好我是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函数在静态页面中使用时会起作用。

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>

请尝试在自己声明 ng-app 和 ng-controller ，并告诉我们。

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

1 个答案: