我之前用java, javascript 和 jquery 做了一個編更網站
如果我想這個網站轉用angular 來做front end,我想問幾個問題:
-
我想這個網頁一開紿就顯示當月的更表, 當用戶按紅圈那個兩箭頭,它就會顯示上一個月或下一個月的更表, 這個應該用什麼方法去做呢?
-
籃色框和橙色框內的data 是來自兩個 JSP 的,
-
另外,綠色框內的data是在browser 計算的,那應該用什麼方法去做呢?
因為我是新手不知道用方法去做才好。
我之前用java, javascript 和 jquery 做了一個編更網站
如果我想這個網站轉用angular 來做front end,我想問幾個問題:
我想這個網頁一開紿就顯示當月的更表, 當用戶按紅圈那個兩箭頭,它就會顯示上一個月或下一個月的更表, 這個應該用什麼方法去做呢?
籃色框和橙色框內的data 是來自兩個 JSP 的,
另外,綠色框內的data是在browser 計算的,那應該用什麼方法去做呢?
因為我是新手不知道用方法去做才好。
先撇開是否有使用框架跟實做細節,就問題本身去思考,你覺得應該要怎麼做,預期會有那些動作跟流程,如過是新手,更不能錯過任何思考的機會
OK, 現在我就在盲試中,如果再有問題可以再問嗎?就算你不怕麻煩時,因為我是"老派"人,由於對新東西不了解,所以只會"新瓶舊酒",這是我有時不知道怎樣問就是這個原因。
所以才要回到基本做思考,而不是拘泥於技術層面,先想清楚需求間的關係,之後只是技術熟悉的問題,因為不管使用什麼技術,都是用來解決問題的。
不要有以前某技術是這樣子做,所以在學新技術時,也應該要這樣子。這樣會讓你學的很辛苦
這陣子,我在嘗試用angular 來試做,我的設計是這樣的, 將整個table 設定為一個component,
而在這table 以下,將藍色和橙色的部份分為兩個component,最終目標是橙色的部份內的小格是可以extends 的,
可以在做admin. function 時在這些小格可以再加其他function 和 feature。
可是後來這個設計不好控制,於是改為將component blue 的內容放回入table component 裡,
發覺控制問題好像解決了,但是component orange 內的HTML 和 app.component html 內的html 不相容,
即是table和component orange最左手邊的那個cell 的闊度不同,我也嘗試用div 來做table ,
可是table右手邊又有rowspan 和colspan 的問題,就算有解決方案,幾個div 的top border 都不能對齊,
即是有些DIV高了一點,有些DIV低了一點,以上是我用DIV , flex box 和grid 來做的結果,不知道angluar 有沒有其他 解決之道呢?
給你個參考方向
類似的方式我都試過,可是就卡住在"Can’t bind to itoRoster since it isn’t a known property of tbody":
另外,請問這一招有沒有名稱的? 如果有可以讓我去google 一下。
app-roster-body 的 component 有設定 input 嗎?
有呀
import { Component, Input, OnInit } from '@angular/core';
import { ITORoster } from 'src/app/classes/itoroster';
@Component({
selector: 'app-roster-body',
templateUrl: './roster-body.component.html',
styleUrls: ['./roster-body.component.css']
})
export class RosterBodyComponent implements OnInit {
@Input() itoRoster: ITORoster;
constructor() { }
ngOnInit() {
}
}
selector: 'app-roster-body',
這裡寫法要改一下,
selector: '[app-roster-body]',
這樣才吃的到
當 selector 單純寫 app-roster-body
,在 html 上面要使用該 component 是 <app-roster-body></app-roster-body>
而這裡是要將此 component 當作 directive 使用,所以要加上 [ ]
才能變成屬性, 使用方式也會改成 <div app-roster-body></div>
原來只差這一點點,it works!!!
thank you very much
那麼這個沒有"[]"的寫法,為什麼在stackblitz就沒有問題,而我卻遇上問題呢?