Custom Control 與 form 的互動

General
1

我的code 在這裡。
我的custom control 不能form.valid 的value。
當我將division 這個field 清空之後,可以看到dirty attribute 已經轉了做true,
但是valid 這個attribute不轉動,請問如何解決呢?

2

因為你還要多實作一個 Validator 的介面，我有改一個範例程式

  1. ControlValueAccessor 只處理資料相關，驗證的部分他不管
  2. 驗證的工作是落在 Validator 上
3

跟我網上找到的solution 一樣,正想找你confirm 一下。
其實用open source 東西,好多時都google 到solution,
只是不知那個work,也不知道那一個才是"正統"。

不過你的solution 使我學到不用自己寫 validator,
只需傳回built-in validator的validation result 給form 就可以了,
這一招暫時是我未見過/未找到相關的solution.

謝謝

1個讚
4

請問如果我要validate 一個object list, 要怎樣做呢?
我試了兩天都不知怎麼辦,煩請各位大大指點迷津。
source code 就在這裡.

5

什麼意思，你想要驗證什麼東西?

6

之前你用viewchild那一招取得form control,
現在我的form control是dynamic生成的，那麼我該如何取得這樣的form control呢?

7

如果是一個清單，你可以用 FormGroup 的角度去看, Formgroup 也有自己的驗證狀態

8

照你這樣說是不是一張form 裡面可以很多個form group, 而一個form group 裡面有很多個form control 呢?

我搞不清楚它們的關係

9

當然可以，但是出來的資料結構也會不一樣，最後送出前在整理一下資料結構，應該不是太困難的事情

讀一下官方文件
https://angular.io/guide/reactive-forms

10

不知道你意思是不是這樣,
但是不知為何ggGroup.valid常常return true,而且又不會影響到templateForm.valid的值。
我是參考這個web page 的,這個web page 說template driven form 也可以用form group 的。

11

我寫了一個 demo ，你看看對你有沒有幫助

12

謝謝Kevin 大大提供reactive form solution.

我參考以下的網頁:

試了兩天,幸運地得出template driven form solution:

簡化version 的source code

比較復雜的version的source code

這兩個version 的分別是:

簡化version:

<app-manualList 
  [manuals]="this.manuals">
</app-manualList>

比較復雜的version:

<app-manualList 
 name="manuals"
 [(ngModel)]="this.manuals">
</app-manualList>

我只知其然,而不知其所以然。
是不是"比較復雜的version"的做法比較正統一點呢?

13

這兩者其實沒什麼差，只差在一個是透過 Input 取直，一個是透過 NgModel，但其重點還是在於 ControlContainer, 這一個省掉很多自己需要實作的功能，但缺點是，功能的封裝程度，如果是使用 ControlContainer，某種層面上只是將 html 的部分抽離而已

ControlContainer 的文件說明

A base class for directives that contain multiple registered instances of NgControl . Only used by the forms module.

但如果你是想要一個很完整的 Custom FormControl, 那就要乖乖的一個功能一個功能的刻