В AngularJS, как определить маршрут, который вызывает определенный метод на контроллере?

Question

Я делаю страницу CRUD с помощью AngularJS, которая будет иметь функцию добавления/редактирования/удаления. Итак, мои маршруты будут что-то вроде этого:

/items (show a list of the items) 
/items/add (show add item form) 
/items/edit/:itemId (show edit item form) 
/items/del/:itemId (Delete item) 

Кажется, что я должен был бы определить другой контроллер для каждого из этих 4-й маршрутов. Например, AddItemCtrl, EditItemCtrl и т. Д. Однако это не кажется оптимальным, поскольку AddItemCtrl и EditItemCtrl собираются разделить значительную часть своего кода. Вместо AddItemCtrl, EditItemCtrl и т.д., я предпочел бы иметь только один контроллер: ItemCtrl, и в моем пути, я предпочел бы указать, если я хочу, чтобы позвонить ItemCtrl.add(), ItemCtrl.edit() и т.д.

Есть ли способ для достижения этой цели или что-то близкое к нему?

Answer 1

В итоге я написал директиву и назначил обработчики кликов для отображения/скрытия соответствующих форм.

Answer 2

Для AngularJS, помните, что это клиентская сторона, поэтому ресурс url не должен напрямую связываться с операцией CRUD. Я бы рекомендовал подумать о маршруте URL как о представлении, а не о операции.

Например, я хотел бы использовать эти:

/items (show a list of the items) 
/items/edit/:itemId (show edit item form) 

я бы не использовать эти:

/items/add (show add item form) 
/items/del/:itemId (Delete item) 

Поэтому я бы не стал использовать URLs выше стороне клиента является то, что чем бы вы показываете для a/items/добавить ресурс? Вероятно, это будет список/items? То же самое касается/items/del /: itemId

Я бы сделал два контроллера. Один из них - контроллер элементов (т. Е. Список элементов) и контроллер элемента (т. Е. Один элемент). Оба должны отложить свою функциональность до центральной службы, которая управляет элементами. Служба будет разрешать операции CRUD и вызывать любые операции CRUD на сервере, которые, вероятно, будут использовать маршруты, как вы изначально определили их.

В качестве дополнительной заметки вы можете иметь контроллер элементов, контроллер ItemsEdit, контроллер ItemAdd и контроллер ItemDelete. Но вы должны держать ваш контроллер очень тонким. В основном там можно вызвать методы ItemsService. Каждый из контроллеров будет просто предоставлять конкретные функции просмотра и откладывать любую реальную работу на службу.

Answer 3

Попробуйте https://github.com/angular-ui/ui-router, отличное дополнение к угловому, что упрощает сопоставление путей к представлениям с иерархическими состояниями, которые позволяют легко обмениваться кодами.

/items - use a deferred promise to resolve the items collection 
     and display a view 
/items/add - display the add form (inherit /items state) 
/items/:itemId - resolve a specific item and display it in the 
     view (inherit /items state) 
/items/:itemId/edit - display the edit form for an item 
     (inherit /items:itemId state) 

Я бы не предоставил Url для удаления элемента.