Question

我有一个主页面，其中包含angularJs的脚本和一个div作为父div，用于加载使用angular创建的html页面。

ParentPage.aspx

<script src="../../Scripts/angular.min.js" type="text/javascript"></script>
<!-- Controller For Angular Page -->
<script src="../../Scripts/Controller/PartialRegistrationController.js"  type="text/javascript"></script>

<script type="text/javascript">
    var app = angular.module("module", []);

    function partialRegistrationForm() { // Function to Initiate load call      
        $('#divFullRegistration').load('../RegistrationPages/PartialRegistration.htm', function (data) {
            console.log(data);
        });
</script>

<div id="divPopupRegistration" class="RegistrationPopup hide" style="overflow: hidden;z-index: 999" ng-app="module">
    <div id="divFullRegistration" class="Full hide">
    </div>
</div>

PartialRegistration.htm

<head>
    <title></title>
    </head>
<body ng-cloak>
    <div ng-controller="partialcontroller" id="parentDiv" ng-init="init()">
        <div class="registrationBg" runat="server" id="PartialRegistration">

        // Some HTML

        </div>
    </div>
</body>

我有一些角度文本框和下拉列表从服务器获取数据。我可以在html页面看到空的下拉列表。

可行我将<script type="text/javascript" src="../Scripts/angular.min.js"></script>放入PartialRegistration.htm

但是角度脚本已经在ParentPage.aspx中加载了，为什么会出现这个问题呢？

Answer 1

问题在于没有通知角度刚刚发生任何事情。您必须创建指令或使用$ compile服务并在添加模板之前传递任何$ scope

$compile(html)($scope);

Answer 2

我相信你应该使用指令绑定事件而不是使用jQuery代码

<强>标记

<div id="divFullRegistration" class="Full hide" my-directive></div>

<强>指令

app.directive('myDirective', function(){
  return {
    restrict: 'AE',
    compile: function(element, attrs){
      //here your all jQuery code will lie to ensure binding
      element.load('../RegistrationPages/PartialRegistration.htm', function (data) {
        console.log(data);
      });
    }
  }
});

Angular没有在div上加载jquery加载函数

2 个答案: