路线导航角度1.5和UI路线1上的动态载荷组件

时间:2018-12-13 14:09:37

标签: angularjs angular-ui-router

嗨,我正在尝试在路线导航上加载组件。原因是组件的html页面大于1 mb。如果我在加载时加载它会减慢UI速度,那么我只想在用户单击特定路线后加载该组件

任何示例都会有所帮助。您可以检查下面我正在尝试的代码。让我知道解决方法。

aboutus-component.js

import AboutUsCtrl from './aboutus-controller'
export const AboutUsComponent = {
    controllerAs : 'vm',
    controller:AboutUsCtrl,
    templateUrl: './aboutus.html'
}

aboutus-module.js

import angular from 'angular'
import {AboutUsComponent} from './aboutus-component.js'
(function(){
  angular.module('analyzerApp')
  .component('aboutus',AboutUsComponent)
  .name
})();

现在点击“关于我们”标签

import(/* webpackChunkName: 'aboutus' */'../app/aboutus-main.js').then(() => {

            setTimeout(()=>{
              $state.go('aboutus', { reload: false });
            },2000)

            //window.location.href="#/aboutus"

        })

aboutus-main.js

importModules(
  require.context('./', true, /^(.*(aboutus)\.js)((?!.*\.(js\.*))$)/i)
);

/**
 * Dynamically imports modules
 * @param request
 */
function importModules(request){
  request.keys().forEach(request);
}

遇到此错误

angular-ui-router.js:3251 Uncaught Error: Could not resolve 'aboutus' from state 'home'
    at Object.transitionTo (angular-ui-router.js:3251)
    at Object.$state.transitionTo (ct-ui-router-extras.js:201)
    at Object.$state.transitionTo (ct-ui-router-extras.js:1599)
    at Object.$state.transitionTo (ct-ui-router-extras.js:1084)
    at Object.go (angular-ui-router.js:3179)
    at ni-footer.js:38

0 个答案:

没有答案