0

这是我的应用程序的基本设置:我有一个主应用程序 (myApp) 和下面的两个模块 (view1, view2)。

这是我的应用程序:

angular.module('myApp', [
  'ngRoute',
  'ui.router',
  'oc.lazyLoad',
  'myApp.view1',
  'myApp.view2',
  'myApp.version'
])

.config(['$stateProvider', '$urlRouterProvider', '$locationProvider',
function ($stateProvider, $urlRouterProvider, $locationProvider) {
$urlRouterProvider.otherwise(function ($injector, $location) {
    var $state = $injector.get("$state");
    $state.go('view1'); 
  });

}])

.config(['$ocLazyLoadProvider',
  function ($ocLazyLoadProvider) {
    $ocLazyLoadProvider.config({
      loadedModules: ['myApp', 'myApp.view1', 'myApp.view2'],
      cssFilesInsertBefore: 'ng_load_plugins_before' // load the css files before a LINK element with this ID. Dynamic CSS files must be loaded between core and theme css files
    });
  }]);

这里是 view1(view2 完全一样,只是把 1 换成了 2):

'use strict';

angular.module('myApp.view1', ['ngRoute', 'ui.router', 'oc.lazyLoad'])

.config(['$stateProvider', '$urlRouterProvider', '$locationProvider',
function ($stateProvider, $urlRouterProvider, $locationProvider) {
  var view1State = {
    name: 'view1',
    url: '/view1',
    templateUrl: 'view1/view1.html',
    resolve: ['$ocLazyLoad', function ($ocLazyLoad) {
      return $ocLazyLoad.load({
        insertBefore: '#ng_load_plugins_before',
        files: [
          'view1/view1.css'
        ]
      });
    }],
  }

  $stateProvider.state(view1State);
}])

.controller('View1Ctrl', [function() {

}]);

view1.css 将所有文本更改为蓝色,view2.css 将所有文本更改为红色。

以下是它当前的工作方式:我从 view1 开始,所有文本都是蓝色的。我转到 view2,它将 view2.css 添加到 head 元素,但是当我返回 view1 时,它不会卸载 view2.css,因此文本永远保持红色。

这是我希望它的工作方式:我从 view1 开始,所有文本都是蓝色的。然后我转到 view2,它从 head 元素中删除 view1.css 并添加 view2.css,将所有文本更改为红色。当我返回 view1 时,它会从 head 元素中删除 view2.css,文本再次变为蓝色。

我该如何做到这一点?

4

1 回答 1

2

来自 ocLazyLoad 的文档

https://oclazyload.readme.io/docs/faq

无法卸载 javascript,但您可以通过删除资源的链接标记来删除 css,如下所示:

$('link[href="/url/to/your/file.css"]').remove();

因此,只需在加载 view1 时为 view2 运行它,反之亦然在加载 view2 时为 view1 运行。

于 2017-03-09T19:13:19.207 回答