AngularJS:路由和控制器的最佳实践
AngularJS: Best practices for routes and controllers
在我们公司,我们目前正在开发单页 Web 应用程序。用户可以登录并用数据填充他们的个人资料,并与其他订阅者共享这些信息(这是一个类似社交网络的应用程序)。
现在,我想象了这个模式:
- 用户数据由 UserService 提供,使用 REST API 恢复配置文件信息;
- 配置文件相关页面由唯一的控制器(ProfileController)管理;
我的问题是:将路由(比如 "view-profile")关联到特定控制器方法(ProfileController.viewProfile)的最佳方式是什么?这是 AngularJS 中的正确模式吗?
谢谢!
进一步调查,我发现实现我想要的结果的最佳方法是在状态配置中使用解析,如本文所述:https://scotch.io/tutorials/making-skinny-angularjs-controllers.
编辑:
我会试着解释一下。我想要实现的是将特定应用程序状态路由到控制器 方法 ,以避免每次访问控制器时都预加载大量数据。假设我的 ui-router
遇到这种情况
.state('view-profile', {
url: '/view-profile',
templateUrl: 'components/profile/profile.html',
controller: 'ProfileController'
})
[...]
.state('edit-profile', {
url: '/edit-profile',
templateUrl: 'components/profile/edit-profile.html',
controller: 'ProfileController'
})
由于 ProfileController 可能会做很多与 edit/view 无关的事情,我想设置一个特定的控制器方法,以便在我导航到这些 url 时调用。
在其他 MVC 框架中,您可以将路由关联到特定的控制器方法,因此您将拥有
route: /edit-profile -> resolvesAs: ProfileController.editProfile(args)
不幸的是,在 AngularJS 1.4 中没有办法做到这一点,至少不使用 ui-router。
但幸运的是,我们可以在 ui-router 配置上使用 resolve
属性来避免为特定路由预加载无用数据。
在我们公司,我们目前正在开发单页 Web 应用程序。用户可以登录并用数据填充他们的个人资料,并与其他订阅者共享这些信息(这是一个类似社交网络的应用程序)。 现在,我想象了这个模式:
- 用户数据由 UserService 提供,使用 REST API 恢复配置文件信息;
- 配置文件相关页面由唯一的控制器(ProfileController)管理;
我的问题是:将路由(比如 "view-profile")关联到特定控制器方法(ProfileController.viewProfile)的最佳方式是什么?这是 AngularJS 中的正确模式吗?
谢谢!
进一步调查,我发现实现我想要的结果的最佳方法是在状态配置中使用解析,如本文所述:https://scotch.io/tutorials/making-skinny-angularjs-controllers.
编辑: 我会试着解释一下。我想要实现的是将特定应用程序状态路由到控制器 方法 ,以避免每次访问控制器时都预加载大量数据。假设我的 ui-router
遇到这种情况.state('view-profile', {
url: '/view-profile',
templateUrl: 'components/profile/profile.html',
controller: 'ProfileController'
})
[...]
.state('edit-profile', {
url: '/edit-profile',
templateUrl: 'components/profile/edit-profile.html',
controller: 'ProfileController'
})
由于 ProfileController 可能会做很多与 edit/view 无关的事情,我想设置一个特定的控制器方法,以便在我导航到这些 url 时调用。 在其他 MVC 框架中,您可以将路由关联到特定的控制器方法,因此您将拥有
route: /edit-profile -> resolvesAs: ProfileController.editProfile(args)
不幸的是,在 AngularJS 1.4 中没有办法做到这一点,至少不使用 ui-router。
但幸运的是,我们可以在 ui-router 配置上使用 resolve
属性来避免为特定路由预加载无用数据。