My AngularJS site has a Browse and Search feature for 2 completely different types of models. Meaning, you can Browse/Search under ModelA which means when the results return to the screen I see a list of DOM elements rending ModelA. You can also Browse/Search under ModelB which also means that results render DOM elements of ModelB.
I would say 95% of the UX needed to support Browse/Search features across both Models is common code. Meaning the inputs, buttons, labels, etc are all pretty much the same.
I can think of a few ways to solve this.
1) Worst - have duplicate everything. Have 2 search pages, 2 browse pages and 2 results pages. This duplicates all the buttons, labels, inputs etc which makes it not very good.
2) Better - We have separate controllers, but shared views. Meaning there is a SearchModelAController
and a SearchModelBController
. This allows us to have a single view (no duplicate HTML), but we can differentiate at the controller level meaning the 1 view file might have a getModelType()
method that returns either ModelA
or ModelB
. Then in the SearchModelAController
we have this function and it just returns "ModelA"
. Then SearchModelBController
would have the exact same method, but it would return "ModelB"
. Then when it comes to displaying the correct Model type in the results list, we would just have a amIModelA()
type boolean method that we could change the view using ng-if
to display the right view model.
3) Best - a combination of the 2. This is where I am not sure exactlyt how I could do it. I want to have a single view when the view truly is common, but when its actually different is there a better way to differentiate other than using the multiple Controller approach I stated in #2?
I hope this makes sense, let me know if more clarification is needed.
Thanks
Aucun commentaire:
Enregistrer un commentaire