各位觀眾老爺大家好,歡迎收看內(nèi)褲總動員之程序猿的IT程序大講堂,書接上文兢卵,這次給大家來分享的是關于ionic中CSS文檔當中的卡片布局和數(shù)據(jù)的調用書寫方式。
首先呢先給大家看一下我寫的一個效果圖啊
在這里啊,我們先看一下這個布局在ionic中的CSS文檔的哪里?
這塊布局來此CSS文檔當中的卡片展現(xiàn)。
復制過來后潦蝇,贊帖到我們的項目中的home.html中。
但是呢這里深寥,有一些地方需要修改攘乒,首先我的效果上面寫著好評論榜。所以關于上面我只留下了一個h2就完事了翩迈。?
下面的布局當中 我在中間有加了一個東西持灰。
這個類名就是指定了當前的div的寬度盔夜。所以我把div設置了百分之50的寬度负饲。分一行兩個布局。
所以我的代碼就成了這樣了喂链。
我把這個制定列寬加入中間后返十,我接下來就該創(chuàng)造數(shù)據(jù)了。
而這回呢椭微,我創(chuàng)造數(shù)據(jù)洞坑,我從server.js中創(chuàng)造數(shù)據(jù)。簡稱叫工廠方法蝇率。
這里呢我簡單的說一下吧迟杂。?
這幾個文件的大體意思就是這個意思。 app.js是文件路徑的地方本慕,server.js是數(shù)據(jù)的地方,controller.js是 控制器的地方排拷。
現(xiàn)在我們要去server.js去創(chuàng)建我們的數(shù)據(jù)。
在這里呢锅尘,我創(chuàng)建的跟下面的數(shù)據(jù)一樣监氢。
都是用.factory()的方式創(chuàng)建。
然后起了一個名字叫“neiKuHomeGoodlist”。然后呢后面呢就是一個回調函數(shù)浪腐。返回我們的數(shù)據(jù)纵揍。
現(xiàn)在創(chuàng)建了數(shù)據(jù),我們需要從controller.js中去訪問我們的數(shù)據(jù)议街。
現(xiàn)在我們數(shù)據(jù)創(chuàng)建完成了泽谨,控制器也訪問數(shù)據(jù)了,接下來我們就可以在home.html中遍歷我們這個數(shù)據(jù)了傍睹。
這樣隔盛,運行瀏覽器后,就可以瀏覽我們的效果咯拾稳。
對啦吮炕,關于你們運行后或許圖片有點大或者格式串格了。 寫一下CSS 代碼 調整一下就哦了访得。
好啦龙亲,關于ionic中的卡片布局和數(shù)據(jù)的調用方法就簡單的給大家介紹到這里了啊。感謝各位觀眾老爺?shù)膶忛喓芬郑缬袉栴}可以踴躍的跟我撕逼哦鳄炉。下期再見咯!~~~~~