angular十大常见问题


Posted in Javascript onMarch 07, 2017

AngularJS可以视为是一种数据优先的框架,在它的三个层面中,数据模型是骨架,视图模型和业务事件是血肉,视图模板和指令是皮毛,这三层合在一起,就形成了一个活生生的Web应用。

1.ng-if的情况下 ,始终将页面中的元素绑定到对象的属性(data.x)而不是直接绑定到基本变量(x)上。因为ng-if 会(隐式地)产生新作用域。

2.ng-repeat迭代数组的时候,如果数组中有相同值,会有什么问题,如何解决?  加 track by $index 可解决。也可以 trace by 任何一个普通的值

3.ng-click 中写的表达式,能使用 JS 原生对象上的方法吗?不能用,只要是在页面中,都不能直接调用原生的 JS 方法。因为这些并不存在于与页面对应的 Controller 的 $scope 中。

<p>{{13.14 | parseIntFilter}}</p>
app.filter('parseIntFilter', function(){
  return function(item){
    return parseInt(item);
  }
})

4.{{now | 'yyyy-MM-dd'}} 这种表达式里面,竖线和后面的参数通过什么方式可以自定义?

ng 内置的 filter 有九种:

date(日期)

currency(货币)

limitTo(限制数组或字符串长度)

orderBy(排序)

lowercase(小写)

uppercase(大写)

number(格式化数字,加上千位分隔符,并接收参数限定小数点位数)

filter(处理一个数组,过滤出含有某个子串的元素)

json(格式化 json 对象)

5.filter 有两种使用方法,一种是直接在页面里:

<p>{{now | date : 'yyyy-MM-dd'}}</p>

另一种是在 js 里面用:

// $filter('过滤器名称')(需要过滤的对象, 参数1, 参数2,...)
$filter('date')(now, 'yyyy-MM-dd hh:mm:ss');

自定义 filter

// 形式
app.filter('过滤器名称',function(){
  return function(需要过滤的对象,过滤器参数1,过滤器参数2,...){
    //...做一些事情 
    return 处理后的对象;
  }
}); 

// 栗子
app.filter('timesFilter', function(){
  return function(item, times){
    var result = '';
    for(var i = 0; i < times; i++){
      result += item;
    }
    return result;
  }
})

6.factory、service 和 provider 是什么关系?

factory返回的是一个对象,而service返回的是一个实例化对象,绑定到 this 的都可以被访问。provider 是加强版 factory,返回一个可配置的 factory

7.性能问题

作为 MVVM 框架,因为实现了数据的双向绑定,对于大数组、复杂对象会存在性能问题。

可以用来 优化 Angular 应用的性能 的办法:

减少监控项(比如对不会变化的数据采用单向绑定)

主动设置索引(指定 track by,简单类型默认用自身当索引,对象默认使用 $$hashKey,比如改为 track by item.id)

降低渲染数据量(比如分页,或者每次取一小部分数据,根据需要再取)

数据扁平化(比如对于树状结构,使用扁平化结构,构建一个 map 和树状数据,对树操作时,由于跟扁平数据同一引用,树状数据变更会同步到原始的扁平数据)

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
发布一个高效的JavaScript分析、压缩工具 JavaScript Analyser
Nov 30 Javascript
JavaScript Event学习第三章 早期的事件处理程序
Feb 07 Javascript
通过javascript获取iframe里的值示例代码
Jun 24 Javascript
jquery animate实现鼠标放上去显示离开隐藏效果
Jul 21 Javascript
给事件响应函数传参数的四种方式小结
Dec 05 Javascript
Area 区域实现post提交数据的js写法
Apr 22 Javascript
Node.js查找当前目录下文件夹实例代码
Mar 07 Javascript
Node.JS利用PhantomJs抓取网页入门教程
May 19 Javascript
关于jquery layui弹出层的使用方法
Apr 21 jQuery
p5.js临摹动态图形的方法
Oct 23 Javascript
JavaScript监听触摸事件代码实例
Dec 30 Javascript
Node.js中的异步生成器与异步迭代详解
Jan 31 Javascript
Bootstrap表单控件学习使用
Mar 07 #Javascript
jQuery插件HighCharts绘制的基本折线图效果示例【附demo源码下载】
Mar 07 #Javascript
Bootstrap进度条实现代码解析
Mar 07 #Javascript
JQuery实现文字无缝滚动效果示例代码(Marquee插件)
Mar 07 #Javascript
JavaScript实现向select下拉框中添加和删除元素的方法
Mar 07 #Javascript
js仿网易表单及时验证功能
Mar 07 #Javascript
JS完成画圆圈的小球
Mar 07 #Javascript
You might like
php类常量的使用详解
2013/06/08 PHP
Netbeans 8.2将支持PHP7 更精彩
2016/06/13 PHP
PHP实现获取ip地址的5种方法,以及插入用户登录日志操作示例
2019/02/28 PHP
JS常见问题整理(持续更新)
2013/08/06 Javascript
JavaScript通过正则表达式实现表单验证电话号码
2014/03/07 Javascript
Nodejs极简入门教程(一):模块机制
2014/10/25 NodeJs
使用AngularJS编写较为优美的JavaScript代码指南
2015/06/19 Javascript
jQuery插件zTree实现删除树子节点的方法示例
2017/03/08 Javascript
Vue 2中ref属性的使用方法及注意事项
2017/06/12 Javascript
原生JS实现轮播图效果
2018/10/12 Javascript
微信小程序提交form操作示例
2018/12/30 Javascript
vue-cli3 项目从搭建优化到docker部署的方法
2019/01/28 Javascript
vue 框架下自定义滚动条(easyscroll)实现方法
2019/08/29 Javascript
超简单的微信小程序轮播图
2019/11/22 Javascript
如何在Vue中使localStorage具有响应式(思想实验)
2020/07/14 Javascript
基于Python_脚本CGI、特点、应用、开发环境(详解)
2017/05/23 Python
Python实现网站注册验证码生成类
2017/06/08 Python
Python2与python3中 for 循环语句基础与实例分析
2017/11/20 Python
Python实现将doc转化pdf格式文档的方法
2018/01/19 Python
python3利用Dlib19.7实现人脸68个特征点标定
2018/02/26 Python
利用python如何在前程无忧高效投递简历
2019/05/07 Python
如何使用Python发送HTML格式的邮件
2020/02/11 Python
Django使用list对单个或者多个字段求values值实例
2020/03/31 Python
python反扒机制的5种解决方法
2021/02/06 Python
python爬虫爬取某网站视频的示例代码
2021/02/20 Python
俄罗斯的精英皮具:Wittchen
2018/01/29 全球购物
英国领先的隐形眼镜在线供应商:Lenstore.co.uk
2019/11/24 全球购物
2014年幼儿园元旦活动方案
2014/02/13 职场文书
民族团结先进个人事迹材料
2014/06/02 职场文书
纪律教育月活动总结
2014/08/26 职场文书
公司试用期员工自我评价
2014/09/17 职场文书
小学向国旗敬礼活动方案
2014/09/27 职场文书
公司租车协议书
2015/01/29 职场文书
2015年教师节感恩寄语
2015/03/23 职场文书
fastdfs+nginx集群搭建的实现
2021/03/31 Servers
使用 CSS 构建强大且酷炫的粒子动画效果
2022/08/14 HTML / CSS