Angular 学习笔记 (Material Select and AutoComplete)
记入一些思考 :
这 2 个组件有点像,经常会搞混.
select 的定位是选择. 目前 select 最糟糕的一点是 not search friendly。
还有当需要 multiple select 很多很多时, 一定要打开 options 来 unselect, 操作不友好.
再来就是如果 option 数据很大的话, 也不行.
有比较才有伤害,上面的不足是对比 autocomplete 才出现的.
autocomplete 的定位是帮助我们完成我们的 input 输入.
范围很小,只是 input text.
经常让我们搞混的原因其实是 autocomplete + chips
这个组合的用法是, autocomplete 作为 search input, 然后选择后放入 chips 里, 再通过 chips 来做移除.
这姐夫可以模拟 select 了.
所以目前通常当我们要用 select 但有遇到上面说的不 friendly 场景时,可以 autocomplete + chips 来模拟一下下.
Angular 学习笔记 (Material Select and AutoComplete)的更多相关文章
- Angular 学习笔记 Material
以后都不会写 0 到 1 的学习记入了,因为官网已经写得很好了. 这里只写一些遇到的坑或则概念和需要注意的事情. Material Table 1. ng-content 无法传递 CdkColumn ...
- Angular 学习笔记 (Material Datepicker)
https://material.angular.io/components/datepicker/overview 官网介绍很清楚了,这里记入一下我比较不熟悉的. 1. moment js Angu ...
- Angular 学习笔记 (Material table sticky 原理)
更新 : 2019-12-03 今天踩坑了, sticky 了解不够深 refer http://www.ruanyifeng.com/blog/2019/11/css-position.html 阮 ...
- angular学习笔记(三十一)-$location(2)
之前已经介绍了$location服务的基本用法:angular学习笔记(三十一)-$location(1). 这篇是上一篇的进阶,介绍$location的配置,兼容各版本浏览器,等. *注意,这里介绍 ...
- angular学习笔记(三十一)-$location(1)
本篇介绍angular中的$location服务的基本用法,下一篇介绍它的复杂的用法. $location服务的主要作用是用于获取当前url以及改变当前的url,并且存入历史记录. 一. 获取url的 ...
- angular学习笔记(三十)-指令(10)-require和controller
本篇介绍指令的最后两个属性,require和controller 当一个指令需要和父元素指令进行通信的时候,它们就会用到这两个属性,什么意思还是要看栗子: html: <outer‐direct ...
- angular学习笔记(三十)-指令(7)-compile和link(2)
继续上一篇:angular学习笔记(三十)-指令(7)-compile和link(1) 上一篇讲了compile函数的基本概念,接下来详细讲解compile和link的执行顺序. 看一段三个指令嵌套的 ...
- angular学习笔记(三十)-指令(7)-compile和link(1)
这篇主要讲解指令中的compile,以及它和link的微妙的关系. link函数在之前已经讲过了,而compile函数,它和link函数是不能共存的,如果定义了compile属性又定义link属性,那 ...
- angular学习笔记(三十)-指令(6)-transclude()方法(又称linker()方法)-模拟ng-repeat指令
在angular学习笔记(三十)-指令(4)-transclude文章的末尾提到了,如果在指令中需要反复使用被嵌套的那一坨,需要使用transclude()方法. 在angular学习笔记(三十)-指 ...
随机推荐
- Ubuntu系统启动后停在(initramfs)
问题 今天我在启动虚拟机过程 遇到莫名其妙的问题,启动不了.如下图.提示某个文件系统错误了.例如我的就是 /dev/mapper/vagrant--vg-root . 上面问题 可把我急坏了,以为虚拟 ...
- 与HTTP关系密切的三个协议:IP,TCP,DNS
IP(网际协议): 位于网络层 通常易混淆的是“IP”和“IP地址”,单独讲“IP”是指一种协议名称 IP协议的作用是将各种数据包传送给对方.而要保证确实传送到对方那里,则需要满足各类条件. 其中两个 ...
- linux 逆向映射机制浅析
2017-05-20 聚会回来一如既往的看了会羽毛球比赛,然后想到前几天和朋友讨论的逆向映射的问题,还是简要总结下,免得以后再忘记了!可是当我添加时间……这就有点尴尬了……520还在写技术博客…… 闲 ...
- android AsyncTask异步任务(笔记)
AsyncTask是一个专门用来处理后台进程与UI线程的工具.通过AsyncTask,我们可以非常方便的进行后台线程和UI线程之间的交流. 那么AsyncTask是如何工作的哪. AsyncTask拥 ...
- 构造方法 this super
1 构造方法 1.1 构造方法Constructor概述创建对象要明确属性值,此时需要用到构造方法,即对象创建时要执行的方法,用来给对象的属性进行初始化.在new对象时,知道其执行的构造方法是什么,就 ...
- DjangoMTV模型之model层——ORM操作数据库(基本增删改查)
Django的数据库相关操作 对象关系映射(英语:(Object Relational Mapping,简称ORM),是一种程序技术,用于实现面向对象编程语言里不同类型系统的数据之间的转换.从效果上说 ...
- python基础(4)-元组&字典&字符串&队列
元组(tuple) #元组相对列表来说不同之处是只读不可写 读操作和列表一致 letter_tuple = ('a','b','c','d'); print(letter_tuple[0]);#res ...
- Python Async/Await入门指南
转自:https://zhuanlan.zhihu.com/p/27258289 本文将会讲述Python 3.5之后出现的async/await的使用方法,以及它们的一些使用目的,如果错误,欢迎指正 ...
- 【JVM】-NO.112.JVM.2 -【JDK11 HashMap详解-2-tab[i = (n - 1) & hash])剖析】
Style:Mac Series:Java Since:2018-09-10 End:2018-09-10 Total Hours:1 Degree Of Diffculty:5 Degree Of ...
- string和int的相互转换方法
string转为int string str = "100000"; stringstream ss; ss << str; int i; ss >> i; ...