带有 Angular 回发的 ASP.NET WebForms答案

【问题标题】：ASP.NET WebForms with Angular Postback带有 Angular 回发的 ASP.NET WebForms
【发布时间】：2013-10-29 17:40:52
【问题描述】：

我试图在现有的 ASP.NET WebForms 应用程序中使用 Angular 框架，我遇到的问题是：

客户端代码：

<select id="fooSelect" class="span8" runat="server" clientidmode="Static">
 <option ng-repeat="foo in foos" value="{{foo.Id}}">{{foo.Title}}</option>
</select>

当表单被提交（整个页面回发）时， fooSelect.Value 的值是"{{foo.Id}}"

如何在服务器端获取所选选项的值？

【问题讨论】：

标签： c# javascript asp.net angularjs webforms

【解决方案1】：

您不能将 Angular 用于服务器选择标签。实际上，回发时在服务器上计算选定的选项值。因此，当您在标记中有 value="{{partner.Id}}" 时，您将得到这个值。在我看来，您可以使用没有 runat="server" 属性的普通 select 元素并将选定的 id 绑定到隐藏字段，可在服务器端访问：

<select ng-model="partner" ng-options="p.Title for p in partners" >
    <option value="">--Select partner--</option>
</select>
<br />
<input type="hidden" id="selectedPartnerId" runat="server" ng-value="partner.Id" />

【讨论】：

这不是最优雅的解决方案，但它有效，我会等着看是否有更好的解决方案，如果没有，会将您的答案标记为正确。谢谢
@Yuriy，如果我需要使用 Js/jQuery 在 Select 元素中注入/修改新值，我会使用相同的技术。在更改时，我使用带有 runat=server 的 Hidd 输入，所以我可以在服务器端读取值。

【解决方案2】：

ASP.Net 不适合与 AngularJS（可能还有其他 SPA）集成。构建 ASP.Net 所针对的抽象使得几乎不可能利用 Angular 的任何功能，例如路由或数据绑定。

ASP.Net 动态生成内容，您没有太多控制权。它将生成包含（如跨度）、动态客户端 ID 和所有以保持数据同步并检测服务器上的更改。

我严重怀疑，是否可以在 AngularJS 中为使用 ASP.Net 生成的内容实现数据绑定。最好的方法是 input 类型与 ng-model 绑定，并通过回发在服务器上获取该数据。

我强烈建议您切换到 ASP.Net MVC

【讨论】：

对不起，但这不是我问题的有效答案，我真的不能切换到 MVC，我不想使用 Angular 路由。我需要解决这个特殊问题
我想说这是对这个问题的有效评论。由于@Chandermani 指出的一些项目，他们没有整合意志。但是在 ASP.NET 中，您可以覆盖控件呈现到页面的方式，但该选项很困难，而且往往弊大于利。
您可以使用 ASP.NET Web API 与 Angular 进行交互。默认情况下，数据从 ASP.NET Web API 以 JSON 格式返回，并且可以从前端的 angular 或 jquery 中使用。
我认为这个答案应该澄清 ASP.Net WebForms 不适合与 Angular JS 集成。 ASP.Net 是一种广泛的技术，其中包括 ASP.NET MVC，它与 Angular 配合得很好。