Puikinsh/gentelella angularjs 中带有 ui-路由器的管理仪表板

Question

我在一个使用 puikinsh/gentelella 的 angular 项目中工作管理员 dashboard.When 我使用 ui.router 模板的 custom.min.js 无法正常工作。

显示 JQuery 错误：Dom 个元素未定义。

当我删除 UI-Router 时，它工作得很好。我的问题是如何将 gentelella 管理仪表板与 UI-Router 一起使用？请帮助我并提前致谢。

Answer 1

我克隆了存储库并实施了 ui-router，它工作正常。

我使用文本编辑器和浏览器同步作为运行主题的服务器。

我遵循的步骤：

1) 从 index.html 中删除了 pageContent div，并在同一文件夹中的 page-content.html 文件中添加了代码。
2) 在 'vendor/angular' 文件夹中添加 angular.min.js 和 angular-ui-router.min.js。
3）创建路由文件/production/js/ui-routing.js如下：

(function(){
  'use strict';

  angular.module('App', ['ui.router']);

  angular.module('App')
  .config(RoutesConfig);

  RoutesConfig.$inject = ['$stateProvider', '$urlRouterProvider'];
  function RoutesConfig($stateProvider, $urlRouterProvider) {

    $urlRouterProvider.otherwise('/');

    $stateProvider
    .state('home', {
      url : '/',
      templateUrl : '/production/page-content.html'
    });
  }
})();

在index.html中添加如下路径：

<script src="../vendors/angular/angular.min.js"></script>
<script src="../vendors/angular/angular-ui-router.min.js"></script>
<script src="js/ui-routing.js"></script>

4) 在 index.html 文件中添加此代码段：

<div ng-app="App">
   <ui-view></ui-view>
</div>

请注意，如果您没有使用运行主题的服务器，ui-routing.js 中的 Html 文件路径可能会有所不同。此外，page-content.html 可能包含一些您需要更改的路径以显示图像和所有内容。除了给定的解决方案外，其他都可以正常工作。

Puikinsh/gentelella angularjs 中带有 ui-路由器的管理仪表板

Puikinsh/gentelella admin dashboard with ui-router in angularjs

angularjs

angular-ui-router

gentelella