⑴ 如何使用 TypeScript 编写 Angularjs 的 Controller
AngularJS 有许多强大的特性,其中之一便是 Controller。在这篇文章里,我将介绍如何使用 TypeScript 去编写 AngularJS 的 Controller。
Controller 通常用来增强 AngularJS 作用域(Scope)
。当一个 Controller 通过 ng-controller
指令连接到 DOM 上的时候,Angular 将使用指定的 Conroller 函数初始化一个新的 Controller 对象。一个新的子 scope 将被创建并作为 $scope
变量注入到 Controller 的构造函数当中。
有两个选项将 Controller 连接到视图当中,一种是 Controller 作为语法,另外一种是使用 $scope
。如果使用 Controller 语法,Controller 实例将被分配一个在新作用域上的属性。
要想知道类型定义,看看 这个令人吃惊的仓库
,它收集了几乎所有流行的 JavaScript 库。这些类型定义可以让我们得到任何编译时错误和 IDE
的智能支持。我使用 Visual Studio 和 Visual Code,它们都对 TypeScript 有很好的支持。
正如上面提到的,AngularJS 只要在被请求的时候都将创建一个Controller 实例。所以,一个 Controller 可以使用
TypeScript 里的类去定义,就像我们所知道的,一个类是可以被实例化的。让我们来使用在视图里 Controller
作为语法的方法来定义一个 Dashboard Controller。下面的代码没有使用 $scope
服务。
interface IDashboardVm {
news: { title: string, description: string };
messageCount: number;
people: Array<any>;
title: string;
getMessageCount: () => ng.IPromise<number>;
getPeople: () => ng.IPromise<Array<any>>;
}
class DashboardController implements IDashboardVm {
static $inject: Array<string> = ['dataservice'];
constructor(private dataservice: app.core.IDataService) {
this.getMessageCount();
this.getPeople();
}
news = {
title: 'News',
description: 'Internal server team is excited about AngularJS, TypeScript & JavaScript'
};
messageCount: number = 0;
people: Array<any> = [];
hubsSummary: Array<any> = [];
title: string = 'Dashboard';
getMessageCount() {
return this.dataservice.getMessageCount().then((data) => {
this.messageCount = data;
return this.messageCount;
});
}
getPeople() {
return this.dataservice.getPeople().then((data) => {
this.people = data;
return this.people;
});
}
}
angular.mole('app.dashboard').controller('DashboardController', DashboardController);
利用 TypeScript 的强类型特征,最好创建一个包含所有和视图相关成员和行为的接口。这就可以使为一个 Controller 定义实现变得容易,而且这个接口如果需要就可以做成一个抽象方法在其他地方使用了。所以,上面代码里我创建了一个名为 IDashboardVm
的接口。
接着,名为 DashboardController
的 Controller 实现了这个接口并给每个成员定义了默认状态。看这个类的静态变量 $inject
,它告诉了 AngularJS DI
在初始化这个 Controller 之前注入哪些依赖。然后构造器在需要的依赖的相同顺序定义了参数当它们被注入到那些参数的时候。
类所提到的依赖都是相当直接了当的,假设 dataservice
是一个自定义的 AngularJS 服务,它封装了所有对服务器发起的 HTTP 请求。根据接口里的每个定义,接下来我们要为这些行为定义实现,内部调用 dataservice
方法。它使用了 promises
去返回待会儿要分配到 Controller 成员上去控制状态的响应。
真正重要的是要注意使用 Angular 的模块 API 注册这个 Controller
的位置。上面的代码里,首先定义了类然后完成其注册。如果这个顺序交换的话,Angular 就将找不到我们这个 Controller
的实现了。当使用一个 JavaScript 构造函数就可以很好地解决问题,因为 函数提升起到了很重要的作用
。
下面是这个 Controller 如何在 Angular-UI UI-Router
中使用的代码片段,但如果你想使用 Angular 内置路由模块的话概念是一样的。注意,这只展示了使用 controllerAs
语法进行配置的部分。
config: {
url: '/',
templateUrl: 'app/dashboard/dashboard.html',
controller: 'DashboardController',
controllerAs: 'vm',
title: 'dashboard',
}
如果你想使用 $scope
服务的话,那么就可以像下面的代码片段那样扩展上面的接口。这将确保所有 IScope 有的成员可以通过接口访问到。使用这个方法还需要改变一下 Controller 类的实现,因为现在它需要 $scope
服务的依赖了。自定义接口类型接着就可以在构造器使用 $scope
参数获得强类型和智能支持了。
interface IDashboardVm extends angular.IScope {
news: { title: string, description: string };
messageCount: number;
people: Array<any>;
title: string;
getMessageCount: () => ng.IPromise<number>;
getPeople: () => ng.IPromise<Array<any>>;
}
⑵ Jquery和Angularjs的区别
1.不要首先设计好你的页面,然后再通过DOM操作去修改它
在jQuery中,你首先设计了一个page,然后再去动态修改它的内容,这是因为jQuery被设计用来进行扩展并在这个前提下大幅度地增加和修改内容,但是在angularjs中,你必须在心中先设计好你的架构,
从一开始,你就要摒弃“我拥有一个DOM元素并且想让它去做某件事”,代之为“需要完成什么任务,然后接着设计你的应用,最后再去设计你的视图view层”。
2.不要使用angularjs去扩展jQuery
相应地,不要存在说让jQuery去干某些事情,然后在此基础上添加angularjs的功能让它去管理model以及controller的想法。所以一般不推荐AngularJS开发新手同时使用jQuery,至少在他们还没有适应AngularJS的开发模式之前不会去推荐这样做,但是当你真正开始适应angularjs 的方式之后,你会发觉这是一件很诱人的事情。
曾经看到过很多开发者采用将150到200行代码的jQuery插件利用angularjs的回调以及$apply方法封装起来,这种方式使得代码看起来极其复杂,但是实际上他们让这些插件跑起来了!问题在于,在大部分情况下jQuery插件能够用angularjs进行重写,并且可能只会使用很少量的代码,同时这种重写使得代码很直观且易于理解,这显然好过于将jQuery代码直接做封装。
所以最后说,当你遇见问题的时候,首先要以angularjs的思维进行思考,如果找不到解决方案,可以求助于社区,如果说没有人能够给出一个简单的方案,那么才考虑使用jQuery,不要让jQuery成为你的拐杖,否则你永远掌握不了AngularJS。
3.要以架构为中心进行思考
首先你要知道单页应用属于web应用,它们不是传统的多网页网站,所以要同时作为一个服务端和客户端开发者的思维进行思考,需要思考如何将我们的应用分为独立的,可扩展的以及可测试的部分。
数据绑定
这是到目前为止AngularJS最令人瞩目的特性了,在数据绑定方面它舍弃了对DOM的操作方式,而这一切都是由AngularJS来自动更新视图,你不必写操作dom的代码,在jQuery中,常常按照响应事件并修改视图
区别model层
在jQuery中,DOM类似于一种model,但是在AngularJS中,拥有不同于jQuery中的model层以便可以以任何我们想要的方式去管理它,它是完全独立于视图之外的。这种方式是有助于进行数据绑定并且可以保持对分离的关注,而且可以具备更好的可测试性。
关注点分离
以上所讲都和这个总体的话题相关:让你关注分离,你的视图层显示记录,你的model层代表数据,你还有个服务层用来执行这些可复用的任务。你使用directive来执行dom操作并扩展你的视图,并将它和controller连接起来,这也就是在其他方面提到的有关于增强可测试性的原因。
依赖注入
帮助解决关注点分离的是依赖注入(DI),如果你是一个服务端开发者(Java或者PHP),你可能已经很熟悉这个概念了,但是如果你是从事客户端开发的,你会觉得这个概念可能有些多余和纯属追求时髦,但是实际上不是这样。
从广义的角度讲,DI意味着你可以自由地声明组件然后从这些组件中进行实例化,这是理所当然的。你不必知道加载顺序,文件位置等诸如此类的事情,这种魔力不是能够立即看到,但是会给出一个例子:测试。
说在应用中,需要一个依赖于应用状态和本地存储的服务用来通过一个rest API来执行服务端存储,当我们测试我们的controller时,不必和服务端进行通信,毕竟只是在测试controller而已。仅添加一个与我们最初组件相同的mock服务,注入器能够确保controller获得一个虚拟的服务,controller自身不必也不需要了解这种差异。
4.以测试驱动的开发
这部分是一个架构的第三部分,但是他是很重要的,以至于需要将它放在最重要的位置。
在所有见过的,用过的以及写过的jQuery插件中,有多少具有一套测试组件呢?其实并不多,这是因为jQuery在测试上不易控制,但是AngularJS却与此不同。
在jQuery中,测试的唯一方法是使用一个demo页去创建一个独立组件来使得的测试可以执行dom操作。接下来我们必须开发一个独立的组件然后将它集成到的应用中来,这是多不方便啊!在很多情况下,当使用jQuery开发实际上是做了很多重复开发而不是以测试驱动的开发,
但是在AngularJS中我们可以关注分离点,所以可以做一些测试驱动的开发。
5.从概念上讲,指令不是打包的jQuery
你常常听说,dom操作只能在指令中,这是必须的,你必须严肃对待。
深入讨论,
某些指令仅仅是装饰视图(例如ngClass),因此有时候直接操作dom是可以的,但是当一个指令类似于一个小物件并且拥有自己的模板,那么它应该当做一个分离的关注点,这就是说,它的模板需要和link中的执行逻辑以及其他controller函数分离开。
AngularJS拥有一整套的工具可以是这种分离更简单,使用ngClass指令,可以动态地更新class,使用ngBind可以进行双向数据绑定,使用ngShow和ngHide 我们
可以采用编程的形式显示和隐藏一个元素,也包括自己写的很多指令。换句话说,可以不用Dom操作而完成所有工作,dom操作越少,指令越容易测试,越容易指定他们的style属性,就越容易在将来改变他们,那么他们就越容易复用和分发。
看过很多AngularJS新手使用指令封装一大串 jQuery代码,换句话说,既然不能在controller里面进行dom操作,那么我可以将他放在指令中,虽然这相对于直接操作dom好很多,但是任然是错误的。
看看在上面的记录,即使我们将其放在一个指令中,任然需要以Angular的方式去操作它,这种方式不执行dom操作!在很多时候dom操作是需要的,但是这种情况比你想的要少得多。当需要做dom操作的时候先问问自己这里是否必须这样做,这才是一种更好的方式。
总结
不要总使用jquery ,甚至不要去引用它,它会阻止你前进,当回到这个问题—你知道你怎么在AngularJS中以jquery方式解决问题,但是当你使用诸如$等选择器时,你要想想它们实际上是禁锢了AngularJS,如果你不知道怎么不用jQuery实现,那么去请教别人,一次一次去问,最好的方式是不需要使用jQuery,使用jQuery只会导致你的工作量提升。
⑶ 如何利用AngularJS服务接入外部API
第一步:准备工作
将AngularJS脚本添加到该文档的当中:
在此之后,可以在将这套CCS样式添加到行内或者独立的文件当中:
*{
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
font-family:sans-serif;
}
body,html{margin:0;}
p{margin:0;}
input{width:100%;}
pre{
white-space:pre-wrap;
white-space:-moz-pre-wrap;
white-space:-pre-wrap;
white-space:-o-pre-wrap;
word-wrap:break-word;
}
div.repo{
border-bottom:1pxsolid;
cursor:pointer;
}
#search,#repo,#user{float:left;}
#search{width:20%;}
#repo{width:60%;}
#user{width:20%;}
如大家所见,其中不存在任何多余的内容、只保留最基础的布局方案——将搜索栏置于右侧、库信息位于中央、用户库同样置于右侧。我们还需要将对应代码行打包至标签当中,此后我们还要利用它显示README文件内容——因为这些内容通常来自GitHub Flavored Markdown、而且其中一部分代码行与用户库列表存在重叠。
当然,大家可以向其中添加更多样式以提升成果的视觉效果——但请注意,本教程中的截图都采取最基本的外观设计。
大家可以未来需要编写的JavaScript代码置于本文档的当中或者为其建立独立文件,但独立文件仍然需要处于AngularJS脚本之下。
第二步:模块
现在我们可以为自己的应用程序创建一个模块:
varapp=angular.mole('githubsearch',[]);
接下来利用ngApp指令将其添加到标签当中:
第三步:控制器
我们还需要为自己的应用程序准备一套控制器。为了简化创建流程,我们将只为应用准备一套控制器,这样我们就不必考虑如何在不同控制器之间进行信息传递了:
app.controller('SearchController',functionSearchController($scope){
});
第四步:基础服务
我们需要对自己的GitHub服务进行定义:
app.factory('GitHub',functionGitHub($http){
return{
};
});
我们将使用app.factory()方法,这样就能保证返回对象附带几个以后将会用到的方法。我们将使用$http服务从GitHub的API中获取数据。
第五步:搜索库
我们服务中的第一项方法负责利用GitHub API对库进行搜索。使用服务非常简单(这项函数能够进入由制造函数返回的对象):
searchRepos:functionsearchRepos(query,callback){
$http.get('https:// api.github.com/search/repositories',{params:{q:query}})
.success(function(data){
callback(null,data);
})
.error(function(e){
callback(e);
});
}
$http.get()方法是执行GET请求的一种捷径。第一条参数是我们希望访问的URL。第二条参数则代表一个具备选项的对象。这里我们只需要params对象——它是一个查询参数散列,将被添加到该请求当中(其中q参数属于搜索字符串,大家可以点击此处了解更多相关信息)。
$http.get()会返回一项承诺。我们可以将监听器附加在success()与error()上,并且据此调用回调函数。
第六步:搜索栏
为了使用我们在之前几步中定义完成的函数,我们需要在自己的HTML当中添加搜索栏。
⑷ AngularJS官网为什么上不去了
来如果你无法访问官网的 api,可以自访问 AngularJS 试试,这是AnguarJS爱好者们发起的一个开发指南中文翻译项目的展示站点,里面有api,目前只有1.2.3版本的,回头有时间更新到最新版本。希望对你有用
⑸ 濡備綍浣跨敤AngularJs鎵撻犳潈闄愮$悊绯荤粺銆愮畝鏄撳瀷銆慱AngularJS
涓銆佸紩瑷
鏈鏂囧皢浠嬬粛濡備綍鎶夾ngularJs搴旂敤鍒板疄闄呴」鐩涓銆傛湰绡囨枃绔犲皢浣跨敤AngularJS鏉ユ墦閫犱竴涓绠鏄撶殑鏉冮檺绠$悊绯荤粺銆備笅闈涓嶅氳达紝鐩存帴杩涘叆涓婚樸
浜屻佹暣浣撴灦鏋勮捐′粙缁
棣栧厛鐪嬩笅鏁翠釜椤圭洰鐨勬灦鏋勮捐″浘锛
浠庝笂鍥惧彲浠ョ湅鍑烘暣涓椤圭洰鐨勪竴涓鏁翠綋缁撴瀯锛屾帴涓嬫潵锛屾垜鏉ヨ︾粏浠嬬粛浜嗛」鐩鐨勬暣浣撴灦鏋勶細
閲囩敤Asp.net Web API鏉ュ疄鐜癛EST 鏈嶅姟銆傝繖鏍风殑瀹炵幇鏂瑰紡锛屽凡杈惧埌鍚庣鏈嶅姟鐨勫叕鐢ㄣ佸垎鍒閮ㄧ讲鍜屾洿濂藉湴鎵╁睍銆俉eb灞備緷璧栧簲鐢ㄦ湇鍔℃帴鍙o紝骞朵笖浣跨敤Castle Windsor瀹炵幇渚濊禆娉ㄥ叆銆
鏄剧ず灞(鐢ㄦ埛UI)
鏄剧ず灞傞噰鐢ㄤ簡AngularJS鏉ュ疄鐜扮殑SPA椤甸潰銆傛墍鏈夌殑椤甸潰鏁版嵁閮芥槸寮傛ュ姞杞藉拰灞閮ㄥ埛鏂帮紝杩欐牱鐨勫疄鐜板皢浼氭湁鏇村ソ鐨勭敤鎴蜂綋楠屻
搴旂敤灞(Application Service)
AngularJS閫氳繃Http鏈嶅姟鍘昏锋眰Web API鏉ヨ幏寰楁暟鎹锛岃學eb API鐨勫疄鐜板垯鏄璋冪敤搴旂敤灞傛潵璇锋眰鏁版嵁銆
鍩虹鏋舵瀯灞
鍩虹鏋舵瀯灞傚寘鎷浠撳偍鐨勫疄鐜板拰涓浜涘叕鐢ㄦ柟娉曠殑瀹炵幇銆
浠撳偍灞傜殑瀹炵幇閲囩敤EF Code First鐨勬柟寮忔潵瀹炵幇鐨勶紝骞朵娇鐢‥F Migration鐨勬柟寮忔潵鍒涘缓鏁版嵁搴撳拰鏇存柊鏁版嵁搴撱
LH.Common灞傚疄鐜颁簡涓浜涘叕鐢ㄧ殑鏂规硶锛屽傛棩蹇楀府鍔╃被銆佽〃杈惧紡鏍戞墿灞曠瓑绫荤殑瀹炵幇銆
棰嗗煙灞
棰嗗煙灞備富瑕佸疄鐜颁簡璇ラ」鐩鐨勬墍鏈夐嗗煙妯″瀷锛屽叾涓鍖呮嫭棰嗗煙妯″瀷鐨勫疄鐜板拰浠撳偍鎺ュ彛鐨勫畾涔夈
浠嬬粛瀹屾暣浣撶粨鏋勫栵紝鎺ヤ笅鏉ュ皢鍒嗗埆浠嬬粛璇ラ」鐩鐨勫悗绔鏈嶅姟瀹炵幇鍜學eb鍓嶇鐨勫疄鐜般
涓夈佸悗绔鏈嶅姟瀹炵幇
鍚庣鏈嶅姟涓昏侀噰鐢ˋsp.net Web API鏉ュ疄鐜板悗绔鏈嶅姟锛屽苟涓旈噰鐢–astle Windsor鏉ュ畬鎴愪緷璧栨敞鍏ャ
杩欓噷鎷挎潈闄愮$悊涓鐨勭敤鎴风$悊鏉ヤ粙缁峈est Web API鏈嶅姟鐨勫疄鐜般
鎻愪緵鐢ㄦ埛鏁版嵁鐨凴EST鏈嶅姟鐨勫疄鐜帮細
浠庝笂闈浠g爜瀹炵幇鍙浠ョ湅鍑猴紝User REST 鏈嶅姟渚濊禆涓嶪UserService鎺ュ彛锛屽苟涓斾篃娌℃湁鍍忎紶缁熺殑鏂瑰紡灏嗘墍鏈夌殑涓氬姟閫昏緫鏀惧湪Web API瀹炵幇涓锛岃屾槸灏嗗叿浣撶殑涓浜涗笟鍔″疄鐜板皝瑁呭埌瀵瑰簲鐨勫簲鐢ㄥ眰涓锛孯est API鍙璐熻矗璋冪敤瀵瑰簲鐨勫簲鐢ㄥ眰涓鐨勬湇鍔°傝繖鏍疯捐″ソ澶勬湁锛
REST 鏈嶅姟閮ㄤ緷璧栦笌搴旂敤灞傛帴鍙o紝浣垮緱鑱岃矗鍒嗙伙紝灏嗗簲鐢ㄥ眰鏈嶅姟鐨勫疄渚嬪寲浜ょ粰鍗曠嫭鐨勪緷璧栨敞鍏ュ瑰櫒鍘诲畬鎴愶紝鑰孯EST鏈嶅姟鍙璐熻矗璋冪敤瀵瑰簲搴旂敤鏈嶅姟鐨勬柟娉曟潵鑾峰彇鏁版嵁銆傞噰鐢ㄤ緷璧栨帴鍙h屼笉渚濊禆涓庡叿浣撶被鐨勫疄鐜帮紝浣垮緱绫讳笌绫讳箣闂翠綆鑰﹀悎銆俁EST鏈嶅姟鍐呬笉鍖呮嫭鍏蜂綋鐨勪笟鍔¢昏緫瀹炵幇銆傝繖鏍风殑璁捐″彲浠ヤ娇寰楁湇鍔℃洿濂藉湴鍒嗙伙紝濡傛灉浣犲悗鏈熸兂鐢╓CF鏉ュ疄鐜癛EST鏈嶅姟鐨勶紝杩欐牱灏变笉闇瑕侀噸澶嶅湪WCF鐨凴EST鏈嶅姟绫讳腑閲嶅嶅啓涓绡嘩eb API涓鐨勯昏緫浜嗭紝杩欐椂鍊欏畬鍏ㄥ彲浠ヨ皟鐢ㄥ簲鐢ㄦ湇鍔$殑鎺ュ彛鏂规硶鏉ュ疄鐜癢CF REST鏈嶅姟銆傛墍浠ュ皢涓氬姟閫昏緫瀹炵幇鎶藉埌搴旂敤鏈嶅姟灞傚幓瀹炵幇锛岃繖鏍风殑璁捐″皢浣垮緱REST 鏈嶅姟鑱岃矗鏇村姞鍗曚竴锛孯EST鏈嶅姟瀹炵幇鏇村规槗鎵╁睍銆
鐢ㄦ埛搴旂敤鏈嶅姟鐨勫疄鐜帮細
杩欓噷搴旂敤鏈嶅姟灞傚叾瀹炶繕鍙浠ヨ繘涓姝ョ殑浼樺寲锛屽疄鐜颁唬鐮佸眰绾х殑璇诲啓鍒嗙伙紝瀹氫箟IReadOnlyService鎺ュ彛鍜孖WriteServie鎺ュ彛锛屽苟涓旀妸鍐欐搷浣滃彲浠ラ噰鐢ㄦ硾鍨嬫柟娉曠殑鏂瑰紡鎶借薄鍒癇aseService涓鍘诲疄鐜般傝繖鏍蜂竴浜涘炲垹鏀规搷浣滃疄鐜板叕鐢锛屼箣鎵浠ュ彲浠ュ皢杩欓噷鎿嶄綔瀹炵幇鍏鐢锛屾槸鍥犱负杩欎簺鎿嶄綔閮芥槸闈炲父绫讳技鐨勶紝鏃犻潪鏄鎿嶄綔鐨勫疄浣撲笉涓鏍风舰浜嗐傚叾瀹炶繖鏍风殑瀹炵幇鍦ㄦ垜鍙︿竴涓寮婧愰」鐩涓宸茬粡鐢ㄥ埌锛歄nlineStore.澶у跺彲浠ュ弬鑰冭繖涓鑷琛屽幓瀹炵幇銆
浠撳偍灞傜殑瀹炵幇锛
鐢ㄦ埛搴旂敤鏈嶅姟涔熸病鏈夌洿鎺ヤ緷璧栦笌鍏蜂綋鐨勪粨鍌ㄧ被锛屽悓鏍蜂篃鏄渚濊禆鍏舵帴鍙c傚瑰簲鐨勭敤鎴蜂粨鍌ㄧ被鐨勫疄鐜板備笅锛
鍥涖丄ngularJS鍓嶇瀹炵幇
Web鍓嶇鐨勫疄鐜板氨鏄閲囩敤AngularJS鏉ュ疄鐜帮紝骞朵笖閲囩敤妯″潡鍖栧紑鍙戞ā寮忋傚叿浣揥eb鍓嶇鐨勪唬鐮佺粨鏋勫備笅鍥炬墍绀猴細
浣跨敤AngularJS寮鍙戠殑Web搴旂敤绋嬪簭鐨勪唬鐮佷箣闂寸殑璋冪敤灞傛″拰鍚庣鍩烘湰涓鑷达紝涔熸槸瑙嗗浘椤甸潰鈥斺斻嬫帶鍒跺櫒妯″潡鈥斺斻嬫湇鍔℃ā鍧椻斺斻媁eb API鏈嶅姟銆
骞朵笖Web鍓嶇疌SS鍜孞S璧勬簮鐨勫姞杞介噰鐢ㄤ簡Bundle鐨勬柟寮忔潵鍑忓皯璇锋眰璧勬簮鐨勬℃暟锛屼粠鑰屽姞蹇椤甸潰鍔犺浇鏃堕棿銆傚叿浣揃undle绫荤殑閰嶇疆锛
棣栭〉 Index.cshtml
浜斻佽繍琛屾晥鏋
浠嬬粛瀹屽墠鍚庣鐨勫疄鐜颁箣鍚庯紝鎺ヤ笅鏉ヨ╂垜浠鐪嬩笅鏁翠釜椤圭洰鐨勮繍琛屾晥鏋滐細
鍏銆佹荤粨
鍒版わ紝鏈鏂囩殑鎵鏈夊唴瀹归兘浠嬬粛瀹屼簡锛屽敖绠℃湰鏂囩殑AngularJS鐨勫簲鐢ㄩ」鐩杩樻湁寰堝氬畬鍠勭殑鍦版柟锛屼緥濡傛病鏈夌紦鍐茬殑鏀鎸併佹病鏈夊疄鐜拌诲啓鍒嗙伙紝娌℃湁瀵逛竴浜汚PI杩涜屽帇鍔涙祴璇曠瓑銆備絾AngularJS鍦ㄥ疄闄呴」鐩涓鐨勫簲鐢ㄥ熀鏈鏄杩欐牱鐨勶紝澶у跺傛灉鍦ㄩ」鐩涓鏈夐渶瑕佺敤鍒癆ngularJS锛屾eソ浣犱滑鍏鍙哥殑鍚庡彴鍙堟槸.NET鐨勮瘽锛岀浉淇℃湰鏂囩殑鍒嗕韩鍙浠ユ槸涓涓寰堝ソ鐨勫弬鑰冦傚彟澶栵紝鍏充簬鏋舵瀯鐨勮捐′篃鍙浠ュ弬鑰冩垜鐨勫彟涓涓寮婧愰」鐩锛歄nlineStore鍜孎astWorks銆