angularjs前端portal技术简介

本文介绍了如何利用AngularJS的特性构建具有高度用户定制化的前端门户,通过对比谷歌的iGoogle Portal,提出需要实现多视图、内容自定义和拖拽编辑等功能,并详细阐述了实现这些功能的步骤,包括在项目启动时读取用户定义信息、动态设置ui-router与ui-view,以及集成angular-sortable-view库实现视图拖拽和编辑。
摘要由CSDN通过智能技术生成

portal门户是一种常见的前端组织结构,用来容纳用户想要看到的个性化内容,具有高自定义,高个性化,可定制,模块化,多视图的特点,下面针对angularjs的特性,在这里我为大家介绍下angularjs的前端portal技术。

没有对比就没有伤害,我们对比下google的igoogle portal来分析下用angularjs做portal时应该注意下什么。

网址:http://www.igoogleportal.com/


如上图所示,经分析,igoogle portal具备如下特点:

1.多视图且视图的数目和大小全为用户自定义

2.视图中的内容为用户自定义,跳转为用户自定义

3.视图可自由拖拽视图内容可编辑


接下来我们从分析传统angularjs前端项目的生命周期及启动入手来分析如何用angularjs做高度用户可定制化的portal,如下:

1.angularjs的视图ui-view定义在ui-router中

2.ui-router定义在angularjs的config()中

3.config()早于run()早于controller()被运行,且在controller中无法改变config的内容。


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值