javascript - 从状态解析函数访问返回的数据

Question

我正在使用 AngularJS 模块 ui-router 并使用 resolve 属性来获取项目的 ID。

在一个单独的文件中，我有组件 patent 用于状态 patents.patent，它具有返回 id 的函数。我需要从 Controller 访问返回的 id，这样我就可以收集与所选项目相关的正确数据。

如何访问 Controller 的 resolve 函数返回值？

var app = angular.module('myApp', ['ui.router', 'chart.js']);

app.config(['$stateProvider', function($stateProvider) {

    $stateProvider
    .state('patents', {
        url: '/patents',
        component: 'patents',
        resolve: {
            patents: function(patentsService) {
                return patentsService.fetchAllPatents();
            },
            graphs: function(patentsService) {
                return  patentsService.fetchGraphData();
            }

        }      
    })
    .state('patents.patent', {
        url: '/{patentId}',
        component: 'patent',
        resolve: {
            patent: function(patents, $stateParams) {
                return patents.find(function(patent){ 
                    return patent.id == $stateParams.patentId;
                })
            },
            graph: function(graphs, $stateParams) {
                return graphs.dataset.find(function(graph){
                    return graph.id == $stateParams.patentId; //NEED THIS VALUE
                })
            }
        }
    })

}]);

---

angular.module('myApp').component('patent', {
    bindings: { 
        patent: '=' ,
    },
    templateUrl: '../templates/patents/list/patent-item.htm',
    controller: function() {
        var vm = this;

        //WHERE I NEED TO ACCESS THE RETURNED VALUE

    }
});

Answer 1

要访问您解析的数据，您只需将它们定义为与您的 Controller 的绑定(bind)。就像您已经完成的 patent 一样。然后你通过你的 vm 变量(或这个)访问它们。

angular.module('myApp').component('patent', {
    bindings: { 
        patent: '<' ,
        graph: '<'
    },
    templateUrl: '../templates/patents/list/patent-item.htm',
    controller: function() {
        var vm = this;

        vm.$onChanges = function(changeObj){
            if(changeObj.patent){
                console.log('I am your patent', vm.patent);
            }
            if(changeObj.patent){
                console.log('I am your graph', vm.graph);
            }
        }
    }
});

正如@rrd 所建议的，您应该保护您的 Controller 不被缩小，但不仅如此，您还应该保护您的解析函数不被缩小。

像这样:

resolve: {
    patents: ['patentsService', function(patentsService) {
        return patentsService.fetchAllPatents();
    }],
    graphs: ['patentsService', function(patentsService) {
        return  patentsService.fetchGraphData();
    }]
}