私はAngularJSの初心者ですが、ASP MVCではなく既存のASP.NET WebフォームプロジェクトにAngularJSを追加したいと考えています。いくつかの調査をした後、私はASP MVCに関するいくつかの文書を見つけたが、asp Webフォームについては見つかっていないので、それに関する詳細な文書はあるか？ AngularJSとAngular2の違いは何ですか？どんな教訓も高く評価されています。ありがとうございます。既存のasp WebフォームにAngularJSを含める方法
私は解決策を発見し、それは、うまく
<script>
function load() {
Sys.WebForms.PageRequestManager.getInstance().remove_endRequest(EndRequestHandler);
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
}
function EndRequestHandler() {
onloadhandler();
}
function onloadhandler() {
angular.bootstrap($("#test"),['myApp']);
}
</script>
を仕事と<body>にonload="load()"を追加することができます。
私は同じボートにいます。 MVCではなくWebフォーム。多くの研究と議論の末、私はAngular2と一緒に行くことにしました。どちらも独自の構文を持っていますが、Angular2は新しいもので、モバイルデバイスのサポートを念頭に置いて開発されています。あなたは自分の意思決定をしなければなりません。私はAngularJSの基礎を学び、今週は角度2の基礎を学んでいます。
これらの2つのリソースは、Githubからのサンプルアプリケーションをダウンロードして、それらを直接操作するのにも役立ちます。
https://thinkster.io/a-better-way-to-learn-angularjs https://thinkster.io/tutorials/learn-angular-2
また、データソースや応答のためのWeb APIを作成する方法を学ぶ必要がありますする必要があります。チュートリアルは主にMVC Web API用ですが、それは問題ありません。あなたはMとそれのC言語を学び、IHttpActionResultを使ってJSONオブジェクトレスポンスとして直接出力する方法を学ぶ必要があります。 AngularJSまたはAngular 2はステロイドのVとなります。
この情報は便利であり、ありがとうございます。主な問題は古いプロジェクトを開発する必要があり、MVCプロジェクトを直接作成できないため、AngularJSを使用してシステムを開発する必要があります。 angleJSはAngular 2の下で使うことができるので、この仕事は望ましいと思うので、将来的には償却されないと思います。
は最近、私は、次の方法を使用し、ポストバックの問題をカバーしようとすると、
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc3" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script type="text/javascript" src="./../js/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="./../js/jQueryUI/jquery-ui-1.12.0.js"></script>
<script type="text/javascript" src="./../js/AngularJS/angular_1.6.5.js"></script>
<script type="text/javascript" src="./../BootsTrap/js/bootstrap.min.js"></script>
<script type="text/javascript">
function load() {
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
}
$(window).bind('beforeunload', function() {
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
});
function EndRequestHandler() {
onloderfunction();
}
$(document).ready(function() {
onloderfunction();
});
function onloderfunction() {
var mod = angular.module("myApp", []);
mod.controller("MainController", function ($scope, $compile) {
});
angular.bootstrap($('#idAngular1'), ["myApp"]);
}
</script>
<link href="./../js/jQueryUI/jquery-ui.css" rel="stylesheet" />
<link href="./../css/jquery.ui.autocomplete.css" rel="stylesheet" />
<link href="./../BootsTrap/css/bootstrap.min.css" rel="stylesheet" />
</head>
<body onload="load()" ng-app="myApp" ng-controller="MainController">
<form id="form1" runat="server">
<cc3:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server" EnableScriptGlobalization="true"
EnableScriptLocalization="true">
</cc3:ToolkitScriptManager>
<asp:HiddenField ID="hidCurrentTab" runat="server" />
<div>
</div>
<div id="tabs">
<div id="tabs-2">
<asp:UpdatePanel ID="uppnlloaddata" runat="server" ChildrenAsTriggers="true">
<ContentTemplate>
<div id="idAngular1" data-ng-app="" data-ng-init="quantity=1;price=5">
<h2>Cost Calculator</h2>
Quantity:
<input type="number" ng-model="quantity">
Price:
<input type="number" ng-model="price">
<p><b>Total in dollar:</b> {{quantity * price}}</p>
</div>
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Button" />
</ContentTemplate>
</asp:UpdatePanel>
</div>
</div>
</form>
</body>
</html>
しかし、私はプログラム、モジュールが利用できない示すシステムポップ・エラー・メッセージを実行したとき。私はまだこの問題に対処しようとしており、これがうまくいくとすれば、私はWebformの下でAngularJSを使うことができると思います。
システムは有用ではありません。申し訳ありません – abramhum