最好的方式来包括UI路由器特定的CSS / JS文件 [英] Best way to include specific css/js files with ui-router

问题描述

我在寻找管理的最佳方式包括CSS文件，

我发现了一个伟大的回答： http://stackoverflow.com/a/20404559/3163545
但是，这是工作只与rootProvider。

因此​​，如何做这样的事情与stateProvider：

 的app.config（['$ routeProvider'，函数（$ routeProvider）{
    $ routeProvider
        。当（'/一些/路由/ 1'，{
            templateUrl：'谐音/ partial1.html'，
            控制器：'Partial1Ctrl'，
            CSS：CSS / partial1.css
        }）
        。当（'/一些/路由/ 2'，{
            templateUrl：'谐音/ partial2.html'，
            控制器：'Partial2Ctrl
        }）
        。当（'/一些/路由/ 3'，{
            templateUrl：'谐音/ partial3.html'，
            控制器：'Partial3Ctrl'，
            CSS：CSS / partial3_1.css'，'CSS / partial3_2.css']
        }）
}]）;
 

非常感谢你：）

解决方案

这个模块可以帮助你：<一href=\"https://github.com/manuelmazzuola/angular-ui-router-styles\">https://github.com/manuelmazzuola/angular-ui-router-styles

  

  

1. 通过凉亭与鲍尔安装它安装角UI路由器的样式--save


  

2. 确保您的应用程序模块指定uiRouterStyles作为一个依赖：
      angular.module（'所有MyApplication'，['uiRouterStyles']）


  

3. CSS文件（S）的相对路径添加到状态数据对象


  

  
  

.STATE（'STATE1'，{
          网址：'/国家，
          控制器：'StateCtrl'，
          templateUrl：意见/我-template.html'，
          数据：{
            CSS：'风格/一些-overrides.css
          }
        }）

I'm looking for the best way to manage the includes of css files,

I've found a great answer : http://stackoverflow.com/a/20404559/3163545 But this is working only with rootProvider.

So how to do something like this with stateProvider :

app.config(['$routeProvider', function($routeProvider){
    $routeProvider
        .when('/some/route/1', {
            templateUrl: 'partials/partial1.html', 
            controller: 'Partial1Ctrl',
            css: 'css/partial1.css'
        })
        .when('/some/route/2', {
            templateUrl: 'partials/partial2.html',
            controller: 'Partial2Ctrl'
        })
        .when('/some/route/3', {
            templateUrl: 'partials/partial3.html',
            controller: 'Partial3Ctrl',
            css: ['css/partial3_1.css','css/partial3_2.css']
        })
}]);

Thank you very much :)

解决方案

This module might help you: https://github.com/manuelmazzuola/angular-ui-router-styles

1. Install it with Bower via bower install angular-ui-router-styles --save

2. Ensure that your application module specifies uiRouterStyles as a dependency: angular.module('myApplication', ['uiRouterStyles'])

3. Add css file(s) relative path to the state data object

.state('state1', { url: '/state', controller: 'StateCtrl', templateUrl: 'views/my-template.html', data: { css: 'styles/some-overrides.css' } })

这篇关于最好的方式来包括UI路由器特定的CSS / JS文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！