javascript - angularjs的resolve到底有什么作用啊?

 le__citron 发布于 2022-11-12 00:37

经常看到人家在resolve里面返回一个factory的数据。然后再controller里面注入。
为什么不直接在controller里面直接注入factory啊?

3 个回答
  • 我们来看一下johnPapa给的解释
    https://github.com/johnpapa/angular-styleguide/blob/master/a1/i18n/zh-CN.md#route-resolve-promises

    当一个controller在激活之前,需要依赖一个promise的完成时,那么就在controller的逻辑执行之前在$routeProvider中解决这些依赖。如果你需要在controller被激活之前有条件地取消一个路由,那么就用route resolver。

    当你决定在过渡到视图之前取消路由时,使用route resolve。

    为什么?:controller在加载前可能需要一些数据,这些数据可能是从一个通过自定义factory或是$http的promise而来的。route resolve允许promise在controller的逻辑执行之前解决,因此它可能对从promise中来的数据做一些处理。

    为什么?:这段代码将在路由后的controller的激活函数中执行,视图立即加载,promise resolve的时候将会开始进行数据绑定,可以(通过ng-view或ui-view)在视图的过渡之间加个loading状态的动画。

    注意:这段代码将在路由之前通过一个promise来执行,拒绝了承诺就会取消路由,接受了就会等待路由跳转到新视图。如果你想更快地进入视图,并且无需验证是否可以进入视图,你可以考虑用控制器 activate 技术。

    /* avoid */
    angular
        .module('app')
        .controller('Avengers', Avengers);
    
    function Avengers (movieService) {
        var vm = this;
        // unresolved
        vm.movies;
        // resolved asynchronously
        movieService.getMovies().then(function(response) {
            vm.movies = response.movies;
        });
    }
    /* better */
    
    // route-config.js
    angular
        .module('app')
        .config(config);
    
    function config ($routeProvider) {
        $routeProvider
            .when('/avengers', {
                templateUrl: 'avengers.html',
                controller: 'Avengers',
                controllerAs: 'vm',
                resolve: {
                    moviesPrepService: function(movieService) {
                        return movieService.getMovies();
                    }
                }
            });
    }
    
    // avengers.js
    angular
        .module('app')
        .controller('Avengers', Avengers);
    
    Avengers.$inject = ['moviesPrepService'];
    function Avengers (moviesPrepService) {
        var vm = this;
        vm.movies = moviesPrepService.movies;
    }
    2022-11-12 01:53 回答
  • 保证数据获取后再跳转路由,这样操作避免了跳转路由后数据还没有获取完成而可能带来的页面闪烁问题。体验也更好

    2022-11-12 01:53 回答
  • 就是可以让控制器更加简洁一下,resolve

    http://www.html-js.com/article/Front-end-source-code-analysis-original-uirouter-source-code-analysis

    详细的可以看这个链接 ui-router 写的很好的

    2022-11-12 01:53 回答
撰写答案
今天,你开发时遇到什么问题呢?
立即提问
热门标签
PHP1.CN | 中国最专业的PHP中文社区 | PNG素材下载 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有