各位觀眾老爺大家好,歡迎收看內(nèi)褲總動(dòng)員之程序猿的IT程序大講堂,書接上文,這次給大家來(lái)分享的是關(guān)于ionic中CSS文檔當(dāng)中的卡片布局和數(shù)據(jù)的調(diào)用書寫方式。
首先呢先給大家看一下我寫的一個(gè)效果圖啊

在這里啊,我們先看一下這個(gè)布局在ionic中的CSS文檔的哪里?
這塊布局來(lái)此CSS文檔當(dāng)中的卡片展現(xiàn)。

復(fù)制過(guò)來(lái)后,贊帖到我們的項(xiàng)目中的home.html中。

但是呢這里,有一些地方需要修改,首先我的效果上面寫著好評(píng)論榜。所以關(guān)于上面我只留下了一個(gè)h2就完事了。?
下面的布局當(dāng)中 我在中間有加了一個(gè)東西。

這個(gè)類名就是指定了當(dāng)前的div的寬度。所以我把div設(shè)置了百分之50的寬度。分一行兩個(gè)布局。
所以我的代碼就成了這樣了。

我把這個(gè)制定列寬加入中間后,我接下來(lái)就該創(chuàng)造數(shù)據(jù)了。
而這回呢,我創(chuàng)造數(shù)據(jù),我從server.js中創(chuàng)造數(shù)據(jù)。簡(jiǎn)稱叫工廠方法。
這里呢我簡(jiǎn)單的說(shuō)一下吧。?
這幾個(gè)文件的大體意思就是這個(gè)意思。 app.js是文件路徑的地方,server.js是數(shù)據(jù)的地方,controller.js是 控制器的地方。

現(xiàn)在我們要去server.js去創(chuàng)建我們的數(shù)據(jù)。

在這里呢,我創(chuàng)建的跟下面的數(shù)據(jù)一樣。
都是用.factory()的方式創(chuàng)建。
然后起了一個(gè)名字叫“neiKuHomeGoodlist”。然后呢后面呢就是一個(gè)回調(diào)函數(shù)。返回我們的數(shù)據(jù)。
現(xiàn)在創(chuàng)建了數(shù)據(jù),我們需要從controller.js中去訪問(wèn)我們的數(shù)據(jù)。

現(xiàn)在我們數(shù)據(jù)創(chuàng)建完成了,控制器也訪問(wèn)數(shù)據(jù)了,接下來(lái)我們就可以在home.html中遍歷我們這個(gè)數(shù)據(jù)了。

這樣,運(yùn)行瀏覽器后,就可以瀏覽我們的效果咯。
對(duì)啦,關(guān)于你們運(yùn)行后或許圖片有點(diǎn)大或者格式串格了。 寫一下CSS 代碼 調(diào)整一下就哦了。
好啦,關(guān)于ionic中的卡片布局和數(shù)據(jù)的調(diào)用方法就簡(jiǎn)單的給大家介紹到這里了啊。感謝各位觀眾老爺?shù)膶忛?,如有?wèn)題可以踴躍的跟我撕逼哦。下期再見(jiàn)咯!~~~~~