在所有组件之前添加要运行的“父”函数[重复]

Question

我不确定这个术语是什么，但我需要为我的应用程序中的所有组件提供相同的数据。以下是我的应用程序的基本结构：

在之前。js

function DataModel(json){
    this.name = json.name || "No name"
}

//// JQuery ////
function getDataModel(name) {
    return $.get(baseURL + "data-model/" + name).then(response => {
        return new DataModel(response)
    })
}

应用etup.js

var app = angular.module('MyApp', ['ui.router', 'ngResource', ...]);

app.config(function($stateProvider,$httpProvider,$urlRouterProvider,$sceProvider) {
    $sceProvider.enabled(false)

    // Each of these components need `getDataModel()` - how can I do that once and send it to all of them with Angular
    states = [
        { 
            name: 'Interactor', 
            url: '/interactor',
            component: 'interactorcomponent'
        },
        {
            name: "otherwise",
            url: "*path",
            component: "viewMDLcomponent"
        }
    ];

    states.forEach(state => $stateProvider.state(state))

    $httpProvider.defaults.useXDomain = true;
    delete $httpProvider.defaults.headers.common['X-Requested-With'];
}

ViewMDLComp。js

angular.module("MyApp").component("viewMDLcomponent", {
    templateUrl: "html/View_MDL.html",
    controllerAs: "c",
    controller: [..., View_MDL_Controller]
})

function View_MDL_Controller($http,$timeout,$filter,$log,$q,$sce,l,FileSaver,Blob) {
    var c = this

    $q.when(getAllDataModels().then(r => {
        console.log("getAllDataModels");
        c.allMisDataModels = r
    })
}

那么，我如何在Angular中运行在我的组件之前编译的东西，并向它们提供它们需要的数据呢？

Answer 1

在jQuery函数中，当您解析您的promise时，将结果分配到附加到窗口对象的全局变量中。喜欢：

window.myAppDataModel = new DataModel(response);

然后在解决此函数后引导角应用程序。

然后定义一个常数，将其指定给该值：

myApp.constant('MY_DATA_MODEL', window.myAppDataModel);

然后在所有需要的服务/控制器中注入这个常量。

即使这样做可行，我的建议是将此逻辑引入服务中，并在状态的解析块中（或者如果需要的话，只在引导块中）执行请求并将值存储在服务中。然后注入服务并在需要的地方访问数据。