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(一)
May 26 Javascript
服务器端的JavaScript脚本 Node.js 使用入门
Mar 07 Javascript
用js实现小球的自由移动代码
Apr 22 Javascript
js实现input密码框提示信息的方法(附html5实现方法)
Jan 14 Javascript
JS两个数组比较,删除重复值的巧妙方法(推荐)
Jun 03 Javascript
js鼠标单击和双击事件冲突问题的快速解决方法
Jul 11 Javascript
Vuejs第一篇之入门教程详解(单向绑定、双向绑定、列表渲染、响应函数)
Sep 09 Javascript
jQuery中的AjaxSubmit使用讲解
Sep 25 Javascript
JS实现的DIV块来回滚动效果示例
Feb 07 Javascript
node安装--linux下的快速安装教程
Mar 21 Javascript
微信小程序-API接口安全详解
Jul 16 Javascript
ElementUI Tree 树形控件的使用并给节点添加图标
Feb 27 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下用cookie统计用户访问网页次数的代码
2010/05/09 PHP
php通过文件头检测文件类型通用代码类(zip,rar等)
2010/10/19 PHP
PHP安全性漫谈
2012/06/28 PHP
PHP在不同页面间传递Json数据示例代码
2013/06/08 PHP
PHP字符串的递增和递减示例介绍
2014/02/11 PHP
Symfony2框架学习笔记之HTTP Cache用法详解
2016/03/18 PHP
Laravel框架实现简单的学生信息管理平台案例
2019/05/07 PHP
Javascript中判断变量是数组还是对象(array还是object)
2013/08/14 Javascript
jquery中load方法的用法及注意事项说明
2014/02/22 Javascript
关于JS数组追加数组采用push.apply的问题
2014/06/09 Javascript
jQuery中hide()方法用法实例
2014/12/24 Javascript
JS实现动态给图片添加边框的方法
2015/04/01 Javascript
Bootstrap框架结合jQuery仿百度换肤功能实例解析
2016/09/17 Javascript
详解jQuery的Cookie插件
2016/11/23 Javascript
Vue3 中的数据侦测的实现
2019/10/09 Javascript
[01:24:51]2014 DOTA2华西杯精英邀请赛 5 25 LGD VS NewBee第二场
2014/05/26 DOTA
[56:45]DOTA2上海特级锦标赛D组小组赛#1 EG VS COL第一局
2016/02/28 DOTA
[32:26]EG vs IG 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
Python列表生成器的循环技巧分享
2015/03/06 Python
归纳整理Python中的控制流语句的知识点
2015/04/14 Python
python中threading超线程用法实例分析
2015/05/16 Python
Python编程之属性和方法实例详解
2015/05/19 Python
Python中zfill()方法的使用教程
2015/05/20 Python
利用Python中的pandas库对cdn日志进行分析详解
2017/03/07 Python
Python多进程库multiprocessing中进程池Pool类的使用详解
2017/11/24 Python
Python简单实现网页内容抓取功能示例
2018/06/07 Python
Django通用类视图实现忘记密码重置密码功能示例
2019/12/17 Python
CSS3实现可翻转的hover效果
2018/05/23 HTML / CSS
制药工程专业个人求职自荐信
2014/01/25 职场文书
企业党员公开承诺书
2014/03/26 职场文书
精神文明建设汇报材料
2014/12/24 职场文书
承诺保证书格式
2015/02/28 职场文书
红楼梦读书笔记
2015/06/25 职场文书
2016继续教育研修日志
2015/11/13 职场文书
openstack云计算keystone组件工作介绍
2022/04/20 Servers
HTML页面中使两个div并排显示的实现
2022/05/15 HTML / CSS