meanjs 如何实现管理仪表板

2024-01-18

Meanjs 使用 AngularJS 进行前端 MVC,并且是一个 SPA 应用程序,因此当管理仪表板与前端页面不同时,实现管理仪表板的最佳方法是什么?也许有两个接入点?


我一直在寻找一种方法来实现这一目标,我在这里发布了我的搜索结果。 首先创建您的新模块:

yo meanjs:angular-module admin
yo meanjs:angular-route adminHome
? Which module does this route belongs to? admin
? What do you want your route path to be? admin-home
? What do you want to call your view? admin-home
? What do you want to call your controller? AdminHome
   create public/modules/admin/config/admin.client.routes.js
   create public/modules/admin/controllers/admin-home.client.controller.js
   create public/modules/admin/tests/admin-home.client.controller.test.js
   create public/modules/admin/views/admin-home.client.view.html

完成第一步后,请检查继续:http://localhost:3000/#!/admin-home http://localhost:3000/#!/admin-home您有效地加载了生成的视图。 然后你开始生成你的快速路线和控制器:

yo meanjs:express-route admin
yo meanjs:express-controller admin

现在乐趣来了。这个想法是告诉 Express 在你点击时加载不同的布局视图集/admin

//Content of app/controllers/admin.server.controller.js
'use strict';

exports.index = function(req, res){
    res.render('admin-index', {
        user: req.user || null,
        request: req
    });
};

//Content of app/routes/admin.server.routes.js
'use strict';

module.exports = function(app) {
    var admin = require('../../app/controllers/admin.server.controller');
    app.route('/admin').get(admin.index);
};

复制粘贴:

app/views/index.server.view.html -> app/views/admin-index.server.view.html
app/views/layout.server.view.html ->app/views/admin-layout.server.view.html

Edit app/views/admin-index.server.view.html:

{% extends 'admin-layout.server.view.html' %}

{% block content %}
    <section data-ui-view></section>
{% endblock %}

Edit app/views/admin-layout.server.view.html:

[...]
{% for jsFile in jsFiles %}<script type="text/javascript" src="/{{jsFile}}"></script>{% endfor %}
[...]

注意前面的“/”{{jsFile}}

最后的接触。因为您的浏览器现在正在加载 /admin 而 / 您需要告诉 ui-router 模板的路径是绝对的而不是相对的。

//Content of public/modules/admin/config/admin.client.routes.js
'use strict';

//Setting up route
angular.module('admin').config(['$stateProvider',
    function($stateProvider) {
        // Admin state routing
        $stateProvider.
        state('admin-home', {
            url: '/admin-home',
            templateUrl: '/modules/admin/views/admin-home.client.view.html'
        });
    }
]);

注意 templateUrl 内容开头的“/”

现在测试您的管理区域,方法是:http://localhost:3000/admin/#!/admin-home

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

meanjs 如何实现管理仪表板 的相关文章

  • AngularJs 数据绑定不适用于 ionic

    我觉得我在离子输入文本中遗漏了一些明显的东西 我在用angular ui router这条路线 stateProvider state findPersons url findPersons templateUrl html findPer
  • 单元测试依赖注入

    我对茉莉花和业力是全新的 我相信我的环境设置正确 并且我能够运行非常基本的单元测试 但是一旦我尝试实例化控制器 我就会收到未知提供程序错误 并且我不确定如何调试它 我需要传入 stateProvider 依赖项吗 我在角种子示例中没有看到这
  • Angularjs 手表服务对象

    为什么我无法观看服务中的对象 我有一个简单的变量可以工作 但是一个对象不能工作 http plnkr co edit S4b2g3baS7dwQt3t8XEK p preview http plnkr co edit S4b2g3baS7d
  • 以角度选择项目后保持菜单打开

    单击我的菜单后 我的菜单将关闭toggleShare按钮 我怎样才能防止这种情况 我将 angularJS 与 Angular 材料一起使用 这是我的代码
  • Access-Control-Allow-Headers 不允许请求标头字段 Access-Control-Allow-Headers

    我试图通过发布请求将文件发送到我的服务器 但是当它发送时会导致错误 Access Control Allow Headers 不允许请求标头字段 Content Type 所以我用谷歌搜索了错误并添加了标题 http post rootSc
  • Angular UI 模式的范围问题

    我无法理解 使用角度 UI 模式的范围 虽然这里不是很明显 但我已经正确设置了模块和所有内容 据我所知 但这些代码示例尤其是我发现错误的地方 index html 其中重要部分 div class btn group div
  • $exceptionHandler 中的 $location - 依赖冲突

    我正在尝试实现一个非常标准的任务 当发生异常时 重定向到我的 error page 代码的简化形式如下所示 app factory exceptionHandler location function location return fun
  • 在 Angular 中让多个调用等待同一个 Promise

    我在一个页面上有多个使用相同服务的控制器 为了举例 我们将服务称为 USER 第一次调用 USER getUser 时 它会发出 http 请求来获取有关用户的数据 调用完成后 它将数据存储在 USER data 中 如果再次调用 USER
  • Protractor e2e 测试表头和 , 标签

    我正在使用下表 我想测试每个标签 th td 标签 该标签中的文本以及该文本的计数 HTML 片段 table class table table striped tbody tr th b a Patient Id a b th th b
  • 如何在 angular-ui 中动态禁用 ui-sortable 指令

    我正在使用 Angular ui 使用 ui sortable 指令进行排序 是否可以根据范围状态动态启用 禁用可排序功能 因此 我需要一个按钮来更改范围属性的状态 并且根据此属性可排序是否应该工作 角度指令支持观察可排序选项何时发生变化
  • AngularUI 可排序不适用于多个应用程序

    我创建了带有可排序列表的 angularjs 应用程序 我的应用程序可以与其他不同的应用程序一起多次包含在页面中 每个角度应用程序都是独立的用户控制 var myapp angular module myapp ui myapp contr
  • 消息:函数在 5000 毫秒后超时 - Protractor & CucumberJS

    cucumberjs version 1 2 2 protractor version 4 0 1 Both installed globally via npm 升级到上面的 cucumberJs 版本后 我不断收到此错误 Failure
  • 切换按钮不适用于 AngularJS 和 Angular ui Bootstrap

    切换按钮出现 但不起作用 我现在在网上也有相同的代码 但它不起作用 但在 Plunker 中它可以工作 Plunker 切换按钮正在工作 http plnkr co edit R5F5D1FGyHiv9X1cfOoa p preview 在
  • 如何发布数组多维角度js

    我在 angularjs 中有一个数组 示例如下 scope order qty 20 scope order adress Bekasi scope order city Bekasi 这个数组可以用这个代码发布 http method
  • angularjs ng-repeat 在两个级别上但只有一个输出

    我有一个看起来像这样的大物体 scope marketplaces first example second example 我想做的是循环遍历大对象 如下所示 section ul li li ul section 在循环内部 再次循环每
  • AngularJS 输入字段未从控制器内的 setTimeout 更新

    我正在使用 AngularJS 支持的页面 并且我需要在只读输入文本字段内显示正在运行的时钟 与data ng model 为了模拟运行的时钟 我使用了 JavaScript 调度程序setTimeout每 1000 毫秒调用一个函数 该函
  • 如果特定 stateParam 为空,如何重定向到 state

    我不确定我这样做的方式是否正确 任何建议将不胜感激 我有一个餐厅选择器 用户可以从中选择一家餐厅 然后所有其他子状态加载特定于所选餐厅的内容 但我需要默认选择一个子状态 包括一家餐厅 它将根据用户最近的位置或 cookie 数据 如果他们之
  • jquery.find() 可以只选择直接子项吗?

    我应该向 jQuery find 提供什么参数来选择元素子元素而不选择其他元素 我不能用 gt 引导选择器 而用 将选择所有后代 而不仅仅是直接子代 我知道 jQuery children 但这是一个库 因此用户能够提供自己的选择器 并且我
  • 将函数传递给指令以在链接中执行的正确方法

    我知道我们通常通过隔离范围将函数传递给指令 directive myComponent function return scope foo 然后在模板中我们可以这样调用这个函数
  • 如何在 AngularJS 循环内使用标签

    所以我在里面ng repeat像这样 li li

随机推荐

  • Ruby on Rails 领域平均水平如何?

    有没有一种简单的方法来获取集合中属性的平均值 例如 每个用户都有一个分数 给定一组用户 users 如何获得该组的平均分数 有类似 users average score 的东西吗 我想我在数据库字段中遇到过类似的东西 但我需要它为集合工作
  • 如何关闭 MFMailComposeViewController?

    我想从我的 Swift 应用程序发送一封电子邮件 它运行良好 它发送了电子邮件 然而 发送电子邮件后 布局并没有退出 我想在发送电子邮件后退出布局 当我按下 取消 删除草稿 或 保存草稿 按钮时 我也希望出现这种行为 这是我必须发送电子邮件
  • 如何在没有 SelectionStart 的情况下设置 TextBox 光标位置

    我有一个 Windows 窗体文本框 后台线程每秒更新其值 如果我将光标放在文本框中 它将在下次更新时丢失其当前位置 文本选择也是如此 我试着这样解决它 protected void SetTextProgrammatically stri
  • 单个页面中的两个 xmlHttpRequest

    我对 ajax 相当陌生 但我正在尝试使用 javascript 实现两个简单的调用来动态更改页面上的两个单独的 div 我一次使用一个调用没有问题 但是当我使用两个调用时 似乎第二个 xmlhttprequest 接管第一个调用并写入两个
  • 使用不完全模式匹配作为过滤器?

    假设我有以下代码 type Vehicle Car of string int Bike of string let xs Car family 8 Bike racing Car sports 2 Bike chopper 我可以在命令式
  • 如何禁止显示后续异常的父异常(原因)

    我知道raise from None并已阅读当我提出自己的异常作为响应时 如何更轻松地抑制以前的异常 https stackoverflow com questions 17091520 how can i more easily supp
  • 限制结果中的字段

    我正在使用 MongoDB v3 0 1 和 MongoDB Java 驱动程序 3 0 0 RC1 我有一个用户集合 其中包含 用户名 名字 姓氏 电子邮件 等字段 现在我想选择所有用户 但仅限于 用户名 名字 和 姓氏 字段 在 Mon
  • 如何在Windows Phone 7应用程序开发中动态显示图像?

    我想动态显示图像 即 如果每当单击特定图像更多 4 到 5 次 时 该图像就会消失 并且新图像可以填充此位置 我想在窗口中动态显示图像使用 silverlight 的电话 7 我知道这是一个很老的问题 但我有几分钟的空闲时间 每四次点击屏幕
  • 使用 Prism 更改 Xamarin Forms 中的页面过渡动画

    是否可以使用 Prism 的 INavigationService 更改 Xamarin Forms 中的页面过渡动画 我希望在 Android 上有淡入淡出动画 就像使用默认的 Xamarin Forms PushAsync PopAsy
  • 查询在 Oracle 11g 上有效,但在 Oracle 8i 上失败

    我在 Oracle 11g 中运行此查询没有问题 select case when seqnum 1 then 1 when seqnum cnt then 0 end as value1 case when seqnum 1 then t
  • Python 字符串格式化:填充负数

    我想将整数格式化为字符串 以便在没有符号的情况下 它们将被零填充以具有至少两位数字 例如我想要 1 1 10 10 to be 01 01 10 10 具体来说 我想要负数 3 和非负数 2 具有不同的最小字符串长度 简单的数字填充详情he
  • 子 span 元素脱离父元素,flexbox / margin - 填充问题

    我阅读了类似问题的帖子 但仍然无法使其正常工作 当有大文本时 我试图使用文本省略号 JSFiddle https jsfiddle net heyrohit bxrpduxu fixIssue align items center thum
  • 具有多个/许多伪选择器/匹配的本机 Javascript querySelectorAll()

    如何在本机 Javascript querySelectorAll 中放置许多伪选择器 示例 我想搜索 id 以 id starting 开头并以 id ending 结尾的元素 找不到现有问题 因此自己制作并回答 对于 Native Ja
  • 我应该如何排列这些“有用”的分数?

    在我网站上的用户生成的帖子下 我有一个类似亚马逊的评级系统 Was this review helpful to you Yes No 如果有投票 我会在该行上方显示结果 如下所示 5 of 8 people found this repl
  • C 中 DBL_EPSILON 和 Machine-Epsilon 的混淆

    Machine Epsilon 似乎有两个定义 将实数舍入到下一个浮点数时的最大相对误差 满足 1 0 machine eps 1 0 的最小正数 首先 我不明白这两者是如何关联的 根据我的理解 第二个 DBL EPSILON 不符合定义
  • 给定素数 N,计算下一个素数?

    一位同事刚刚告诉我 出于与哈希相关的神秘原因 C 字典集合按素数调整大小 我直接的问题是 它如何知道下一个素数是什么 它们是否记录一个巨大的表或动态计算 这是一个可怕的非确定性插入运行时间 导致调整大小 所以我的问题是 给定 N 质数 计算
  • 在 virtualenv 中执行 os.system('python ')

    我正在使用一个virtualenv要执行脚本 在这个脚本中我调用 os system python anotherScript py 我的问题是脚本是否在同一个中执行virtualenv作为调用者脚本 很难说 但是如果您在激活的 virtu
  • git - 樱桃挑选 - 如何/为什么

    问题 您想测试某人开发的功能 但它只是 存在于一个严重过时的远程分支中 Source http wiki koha community org wiki Using Git Cherry Pick cherry pick是如何解决这个问题的
  • 如何创建一个自动关闭的 HTML5 标签,例如
    [已关闭]

    Closed 这个问题需要多问focused help closed questions 目前不接受答案 我基本上想制作一个不需要关闭的自定义标签并将CSS应用于它 它不应该看起来像这样
  • meanjs 如何实现管理仪表板

    Meanjs 使用 AngularJS 进行前端 MVC 并且是一个 SPA 应用程序 因此当管理仪表板与前端页面不同时 实现管理仪表板的最佳方法是什么 也许有两个接入点 我一直在寻找一种方法来实现这一目标 我在这里发布了我的搜索结果 首先