angularjs – 根据配置配置UI路由器状态

发布时间：2020-12-17 17:14:17 所属栏目：安全来源：网络整理

导读：有没有办法根据服务器端 JSON文件配置UI路由器状态.我不想避免对module.config(..)中的状态进行硬编码. 我首先想到的是具有可用状态映射数据的控制器,它可以调用$stateProvider.但是,我相信,控制器不能将提供者注入其中. 我想到的另一个选项是在angular之外

有没有办法根据服务器端 JSON文件配置UI路由器状态.我不想避免对module.config(..)中的状态进行硬编码.

我首先想到的是具有可用状态映射数据的控制器,它可以调用$stateProvider.但是,我相信,控制器不能将提供者注入其中.

我想到的另一个选项是在angular之外有一个Javascript文件,它将状态配置数据放在某个全局变量中,以便从Module config函数中引用.

但是有更好的方法吗？

解决方法

我会说,通常有两种方法可以使用SERVER数据(JSON)来构建状态.

首先,我们可以使用$http加载JSON：

AngularJS – UI-router – How to configure dynamic views

这里的重点是,我们将在.config()状态存储对$stateProvider的引用并在.run()阶段使用它,一旦JSON可以通过$http加载

// ref to provider,to be configured later
var $stateProviderRef;

// config phase
app.run(['$stateProvider',function ($stateProvider) 
  {
    $stateProviderRef = $stateProvider
  }

// run phase
app.run(['$q','$rootScope','$state','$http',function ($q,$rootScope,$state,$http) 
  {
    $http.get("myJson.json")
    .success(function(data)
    {
      angular.forEach(data,function (value,key) 
      { 
          var state = {
            "url": value.url,...
          };
          ...
          // here we still configure provider,but in RUN
          $stateProviderRef.state(value.name,state);
      });

但是有一些缺点.主要是,直接网址导航(复制 – 粘贴)将无法正常工作.该网址不会很快得到解决……

其次,我首选的方法 – 在服务器上创建JSON作为变量,将其作为脚本加载.

所以服务器会以某种方式通过/ api / stateData生成响应,如：

var stateData  = [{ stateName : "State1",...
}];

我们将把它作为资源注入页面

<script src="/api/stateData" ...

这可以直接在.config()阶段使用,并将解决很快配置URL的问题.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!