Angular發(fā)布1.5正式版,專(zhuān)注于向Angular 2的過(guò)渡
Angular團(tuán)隊(duì)最近發(fā)布了Angular 1.5的正式版,該版本實(shí)現(xiàn)了一次重大的升級(jí),它讓仍在使用1.X版本的開(kāi)發(fā)者將能夠更容易地過(guò)渡到Angular 2的開(kāi)發(fā)。
Pete Bacon Darwin在此次發(fā)布 聲明 的博客文章中寫(xiě)道,這次發(fā)布的目的是“改進(jìn)Angular 2的升級(jí)路徑。我們?cè)谶@次發(fā)布中引入了一些新的特性,讓開(kāi)發(fā)者編寫(xiě)的Angular 1應(yīng)用更接近于在Angular 2中應(yīng)用的結(jié)構(gòu)?!?/p>
此次發(fā)布中,新的module.component()輔助方法是向Angular 2進(jìn)行過(guò)渡的最大變更。通過(guò)使用該方法,開(kāi)發(fā)者就不必再遵循傳統(tǒng)的directive定義對(duì)象風(fēng)格編寫(xiě)directive了。如果讀者已經(jīng)熟悉Angular 2的寫(xiě)法,就應(yīng)當(dāng)注意到這種相似性。在文章中,作者通過(guò)一個(gè)示例表現(xiàn)了定義一個(gè)新component的方法:
myModule.component('myComponent', {
template: '<h1>Hello {{ $ctrl.getFullName() }}</h1>',
bindings: { firstName: '<', lastName: '<' },
controller: function() {
this.getFullName = function() {
return this.firstName + ' ' + this.lastName;
};
}
});
在component出現(xiàn)之前,開(kāi)發(fā)者通常只能使用directive,或是通過(guò)對(duì)controller的非常規(guī)使用才能夠?qū)崿F(xiàn)某些場(chǎng)景。但這并不是說(shuō)component就將完全取代directive的作用了,比方說(shuō)component就無(wú)法用于操作DOM,并且所有的component都必須通過(guò)自定義的HTML元素激活,而不支持通過(guò)元素的屬性觸發(fā)。按照以上方式定義的component可通過(guò)以下代碼使用:
<my-component first-name="'Alan'" last-name="'Rickman'"></my-component>
新的 component指南 對(duì)于傳統(tǒng)的directive與component之間的區(qū)別提供了更完整的說(shuō)明。
單向綁定
生命周期鉤子
綁定至必需的directive
支持多個(gè)slot的transclusion
默認(rèn)transclusion內(nèi)容
目前在使用1.4版本的開(kāi)發(fā)者可以閱讀 遷移指南 以了解遷移時(shí)需要進(jìn)行哪些必要的變更,因?yàn)?.5版本中引入了一些破壞性的變更。
在可預(yù)見(jiàn)的一段時(shí)間內(nèi),1.5版本應(yīng)當(dāng)是最大的一次變更了。當(dāng)InfoQ向Bacon Darwin問(wèn)及1.X版本將何去何從時(shí),他是這樣回答的:
我們還沒(méi)有開(kāi)始計(jì)劃Angular 1的下一次發(fā)布周期。由于離Angular 2正式發(fā)布的日期已經(jīng)越來(lái)越近了,因此如果我們繼續(xù)開(kāi)發(fā)Angular 1,那么也會(huì)盡量使它更接近于Angular 2。如果為了實(shí)現(xiàn)這一點(diǎn)而必須引入破壞性的變更,那么可以預(yù)計(jì)1.6版本的出現(xiàn)。同時(shí),我們還將繼續(xù)Angular 1.5.x版本的開(kāi)發(fā),提供bug的修復(fù)以及一些較小的特性??傊?,這與我們讓Angular 1.X更易于遷移至Angular 2的目標(biāo)并不沖突。
新的component router特性應(yīng)當(dāng)在本周的稍晚時(shí)間發(fā)布。感興趣的朋友敬請(qǐng)關(guān)注腳本之家網(wǎng)站!
相關(guān)文章
詳解基于Bootstrap+angular的一個(gè)豆瓣電影app
本篇文章主要介紹了基于Bootstrap+angular的一個(gè)豆瓣電影app ,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2017-06-06
基于AngularJS實(shí)現(xiàn)的工資計(jì)算器實(shí)例
這篇文章主要介紹了基于AngularJS實(shí)現(xiàn)的工資計(jì)算器,結(jié)合具體實(shí)例形式分析了AngularJS數(shù)值計(jì)算相關(guān)操作技巧,需要的朋友可以參考下2017-06-06
AngularJS頁(yè)面訪問(wèn)時(shí)出現(xiàn)頁(yè)面閃爍問(wèn)題的解決
這篇文章主要介紹了AngularJS框架使用中出現(xiàn)頁(yè)面閃爍問(wèn)題的解決方法,閃爍問(wèn)題一般是初始化未加載完畢造成的,需要的朋友可以參考下2016-03-03
angular+ionic 的app上拉加載更新數(shù)據(jù)實(shí)現(xiàn)方法
這篇文章主要介紹了angular+ionic 的app上拉加載更新數(shù)據(jù)實(shí)現(xiàn)方法,需要的的朋友參考下2017-01-01
JavaScript框架Angular和React深度對(duì)比
這篇文章主要介紹了JS框架中Angular和React不同和差異,以及兩個(gè)框架的深度對(duì)比介紹。2017-11-11
AngularJS中如何使用$http對(duì)MongoLab數(shù)據(jù)表進(jìn)行增刪改查
這篇文章主要介紹了AngularJS中如何使用$http對(duì)MongoLab數(shù)據(jù)表進(jìn)行增刪改查的相關(guān)資料,需要的朋友可以參考下2016-01-01

