I have created three dropdown buttons and want to populate them on the basis of selection from previous button.The data is in an object array as below:
[{"LINK":"B_LINK_01","NAME":"name-04","TYPE":"BB"},{"LINK":"A_LINK_01","NAME":"name-01","TYPE":"BB"},{"LINK":"C_LINK_01","NAME":"name-03","TYPE":"AA"},{"LINK":"C_LINK_05","NAME":"name-04","TYPE":"BB"}]
First drop-down should contain all unique TYPE values. When one of the TYPE is selected, the second drop-down should populate with all the unique NAME values corresponding to TYPE. When NAME is selected from second drop-down then the third drop-down should populate with all corresponding LINK values. For ex: The first dd should show BB, AA in the list. if I select BB then second drop-down should populate with name-04 and name-01. Next, if I select name-04 then the third drop-down should populate with B_LINK_01 and C_LINK_05.
P.S. I have referred multiple tutorials and SO threads but did not find a solution relevant to the object array I have. Any help in Angular JS will be appreciated