gpt4 book ai didi

asp.net - AngularJS 与 ASP.NET Updatepanel 部分更新

转载 作者:行者123 更新时间:2023-12-04 05:18:12 24 4
gpt4 key购买 nike

我是 AngularJS 的新手,所以这可能是一个微不足道的问题。

我面临的问题是,只要有更新面板部分更新,AngularJS 绑定(bind) {{Object.Field}} 就会恢复为未格式化状态。我知道更新面板正在用非格式化文本({{Object.Field}})替换 DOM,但我无法从 Angular 重新评估更新面板注入(inject)的 HTML 片段。

到目前为止我已经尝试过:

  • 从更新面板的 End_Request 获取 Controller 范围的句柄,并将更新函数包装在 $scope.apply() 内的 Controller 上;
  • 在同一位置和 Controller 内部调用 $scope.compile,结果没有变化。
  • 尝试用指令替换,但我认为这不是我想要的。

  • 我可以获取 Controller 内部 DOM 的句柄并直接更改它,但我知道这不是推荐的方法,因此我在这里问这个问题。

    如何使 Angular 重新评估 HTML 片段,由 asp.net 更新面板的部分更新替换/注入(inject)?

    最佳答案

    您需要在 PageRequestManager 的 End_Request 中再次编译模板。我使用了一个带有 id 的 div,因此我可以在 End_Request 函数中引用感兴趣的元素。

    javascript代码:

    var mod = angular.module("myApp", []);

    mod.controller("MainController", function ($scope, $compile) {
    $scope.data = {};
    $scope.data.world = "world";

    Sys.WebForms.PageRequestManager.getInstance().add_endRequest(function (sender, args) {
    var elem = angular.element(document.getElementById("angularTemplate"));

    elem.replaceWith($compile(elem)($scope));
    $scope.$apply();
    });
    });

    asp代码:
    <body ng-app="myApp" ng-controller="MainController">
    <form id="form1" runat="server">
    <div>
    <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>
    <div id="angularTemplate">
    Hello, {{data.world}}
    </div>

    <asp:Button ID="btnUpdate" runat="server" Text="Update Me" />
    </ContentTemplate>
    </asp:UpdatePanel>
    </div>
    </form>
    </body>

    单击“更新我”按钮将在模板中保留“你好,世界”。关键是还要在 End_Request 中调用 $scope.$apply(),因为这在技术上是在 Angular 之外运行的。

    关于asp.net - AngularJS 与 ASP.NET Updatepanel 部分更新,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21832540/

    24 4 0
    Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
    广告合作:1813099741@qq.com 6ren.com