00:00
好嘞,各位在这小节呢,我们一起来学习一下view里的这个模板语法,关于模板这个概念啊,之前已经跟大家说过了啊,在零一里面我们写过这么一个注释,说root容器中的代码啊被称为view模板,诶,也就是说我所有红色框里的这些东西啊,都是view的模板,有了模板那就得有特殊的模板语法,截止到目前呢,大家学会的其实只有一个模板语法,就是这个双花括号里边写表达式,对吧?我们管这种叫做什么语法来着?差值语法,那除了差值语法还有哪些呢?我们一起探讨一下,关掉,回到这里面啊,文件和文件夹以及里边这些固定的内容我都已经提前写好了,哎,回到课件当中啊,1.2过了,进入1.3。其实在view里面啊,各位模板语法呢,是有两大类的,第一大类呢是差值语法,我们学过了,哎,它能实现的这个功能啊,很单一,就是把指定的值放在指定的位置,诶还有一种其实叫做指定语法,那它所能完成的事儿啊,就比较高端了,诶我们慢慢来啊,首先把上半部分呀给它实现了,H1标题写上差值语法,里边写了一个你好Jack,而且了一个Jack呢,是一个动态的数据,好回到代码中简单写一下,写个H1啊,叫做差值语法,下边呢有一个H3啊,叫做你好Jack,我这么写肯定不行啊,它就是一个写死的数据了是吧?哎,一会呢,我们再写那个view实例,先写一个分割线,那走吧,得你一个view里边得写上一些配置项,得写EL型号route,然后得配置数据对吧?人的名字吗?Name Jack,好,那我这就不能这么写了,你知道得写差值与法。
01:47
写上内幕插值嘛,就把这个内幕这个值诶插入到这个位置了,好,我们打开页面看一下啊走诶插这语法你好Jack对吧,这儿呢,咱就不再多聊了,之前都说过了,好了,接下来呢,看着啊学点新的东西了,回到课件里,指令语法,这是一个写死的数据啊,就是1H1标题,接下来呢,我要写两个A标签,哎点我去上硅谷学习一和学习二,点完这A标签啊,能够跳转到我们上硅谷的官网,好,那简单写写啊回到代码中,走H1,哎叫做指令语法好走着这边写一个A标签,那HRA是不是得写一个具体跳转的地址啊啊艾硅谷这好好,那这呢叫做点我去学习一啊,去哪儿呢?上硅谷学习一。
02:40
好,回到页面啊,看一下效果,诶出现了A标签,右键检查看一下有没有地址,有诶点一下看能不能跳转走,是不是能跳转啊,能跳转诶就行,我们回来那像我这么写啊同学你觉没觉得我就是把跳转的地址啊就写死了,我想让这个地址啊是动态的,那怎么办呀。
03:00
那你应该知道啊,咱们是不是把这个地址存在这个view实例当中啊,所以说我得这么写URL,诶把具体的地址给他咋的带走,是不是往这儿写呀,那同学请问光标闪烁的位置接下来怎么写呀?说老师要不我直接写个URL,那你觉得这么写对吗?各位,H re EF等号直接引号来个uf,那你自己看效果吧,右键检查瞧,嗨,同学,就真的是URL,诶三个字符这是不对的,我要从这读出来,你说对吧?各位,那你可能就想到了,诶老师明白了,我想把Jack诶这个名字放到这个位置,那我就在这块写差值,那老师同理呗,我想把URL里边保存的地址啊,放在光标闪烁的位置,那我就这么写了,删掉删掉,我这直接写哎,这种差值,嗯,老师写URL,哎,你说这么写对吗?各位。
04:00
咱试试哈,哎,回到页面里面看同学怎么了呀,它不对呀,它把你的那个花括号,哎,什么URL全都当成字符串,是不是给你写在这儿了呀,而且你看控制台啊,它有一个警告,同学我们读一读啊,这个警告又错了,哪错了呢?模板编译失败,我们读一下详细的报错信息啊,他说你这块儿啊,有点问题,我先给大家翻译翻译这些单词,然后咱再捋顺的翻译一下啊同学,这是什么意思呀?这个词呢,就有插入差值的意思,Inside是什么理念?Attributes叫做属性啊,Remove叫移除了,或者叫弃用了,是吧?哎,然后再往后看,同学这是什么意思呀?Colon它有冒号的意思啊,这个什么意思呀?这单词有简写的意思,那这单词呢,代替替代的,哎,行了,咱又不是上英语课啊,我给你整体的翻译一下,他说呀,你这有问题,那问题是什么呢?读一下同学,他说你用差值语法。去动态的指定一个标签里边的标签属性,这种方式已经被移除了,你不能这么写了,也就是他的潜台词是很早之前是可以这么写的,但是现在不行了,在读后半句,请你使用V-B的或者是冒号的这种简写形式去代替。
05:19
怕你不会,还给你举一个例子,哎,他说呀,你这种写法不行了,那需要你写的是这种,哎,用这个去代替他冒号ID,那当然了,他给你的这种写法吧,他直接就写成了这个简写的形式,那咱要给大家讲吧,咱就得说说这个冒号ID的原始写法是什么样的,其实原始写法就是V-band,好了,咱不在这儿呢,读太多,直接操练起来,回到代码里面,各位看着啊,不能这么写,你把它删掉,还写引号,还写ul,那你可能说老师不是说了吗,这么写它不行啊,那你刚看完吗?右键检查它不可以啊,诶,加个东西就可以了,瞧着啊,回到代码里面,在HRA前边我写一个V杠。
06:03
Band冒号同学,Band有什么意思呀?是不是有绑定的意思?哎,V-band同学就属于view u里的一个指令,View里的指令都有一个特点,都是V杠开头,以后你可能会学到V-if对吧?V-model有很多的东西等着你去学呢,哎,形式都是V杠,诶什么什么什么东西好,那我们现在接触到的是谁呢?V杠办的啥意思,绑定?老师,我这么写是什么意思呀?瞧着你这么写之后啊,你这个引号里边的URL,那可就当成GS表达式去执行了,你一定听好我说这话,如果你前边不加这个V杠的冒号,那这就是一个再普通不过的一个标签属性对吗?HF值呢,字符串URL,但是如果你加了这个V杠半的冒号,那你听我说各位就会把你绿色框里的东西,也就是说两个引号里边包着的那个东西拿出来当啥执行GS表达式去执行。
07:05
哎,所以说同学这是新手啊,特别需要扭转的一个地方,你始终觉得引号里边包着的东西一定啊,那就是字符串,不是前边一旦遇到了这个东西,来吧,哥们,这里边的东西当成表达式去执行,那么同学表达式URL啥意思呀?是不是在读取URL这个变量啊,那这个数据它在哪儿呢?是不是在这儿呢呀,那你提前不是写好了吗?这个时候各位你瞧着回到这儿刷新来看。东西是不是出来了?哎,品味品味,你想一想V杠半的绑定,那绑定什么呀?把这一堆红色的表达式执行的结果绑定给HFOK,好,朱老师,那这不就得了吗?那就这点事儿呗,啊,那我记住了,V杠办的呀,就只能动态的指定HF,其实不是的,各位可以指定任何一个属性,你比如说啊,我这里边有一个标签属性,它的名呢是X,哎,它的值呢是hello,好了,那各位回头看看X好对吧?哎,同学不用想太多,这不就是正常的标签属性吗?
08:10
但是如果我在前面加一个V杠半的冒号,请问你说接下来啊,它会出现什么效果呢?你加了V杠半的对吗?嗯,他就把绿色框里边的这个东西拿出来当成什么呀,GS表达式去执行,发现在读取一个变量啊,谁呀,Hello,那你这里有hello吗?没有,所以说嘛,控制台就会报出一个警告,哎,同学,你见过多少次了,有一个属性或者是什么呀,方法叫什么呢?Hello咋的没有定义,你现在这儿啊,不用纠结说老师方法咱还没学,如何去定义一个方法呢?对吧?哎,咱只学过什么呢?定义这个property,哎,这个属性,那如果你在这里边,你给他准备了一个hello hello的值呢?你比如说举个例子啊,是你好,那这个时候你瞧各位它就不报错了,而且最主要的你检查你瞧X是不是你好。
09:00
所以说同学V杠半的可以给标签里的任何一个标签属性动态的去绑定值,说老师呢,我不喜欢给X动态的绑定,我就想写死V杠半的冒号,直接一删就可以了,回来看这对吧,好诶那再说一下同学这个V-B的呀,它还能简写啊,怎么简写呢,你瞧着我把这呢复制一份,这叫点我去学习几呢二。同学,你总写V杠半的是不是特别麻烦呀?哎,简单写怎么写呢?看着V杠半的冒号可以简写为冒号。哎,同学注意了啊,我说V杠半的冒号能简写成啥冒号?不是说所有指令都能简写成冒号,那是不可能的。同学以后我们会学习一个东西叫做V-if说老师他有没有简写形式呢?那他没什么简写形式对吧?说老师是不是也简写成冒号,那不开玩笑呢吗?同学都写成冒号,那不乱了吗?删掉好了,各位回来刷新,你看学习二是不是也读出这地址了,是不是也有这hello啊,那如果你想要X的动态的可以啊,冒号X对吧?当然是英文的,哎,你这写什么呢?你比如说写上哈是吧?哎,我这不有吗?哈师你好,那你瞧吗,OK。
10:12
好吧,哎,那我把这hello呢删掉,哎,我在这儿呢,给它也删掉,我的意思是你可以正常的写一个标签的属性,我讲到这儿的时候呀,如果我说现在停东西吧,也算讲完了,但是各位就乱了,老师什么时候用差值啊,什么时候又用指令啊,这给我绕晕了呀,同学你仔细看,其实它有规律,差值语法往往用于指定标签体内容,那么标签体是啥意思呀?各位来来来来,我所有红色框里的东西,你觉不觉得都叫标签体?是吧,好啥意思,很简单,各位啊,起始标签和结束标签中间所夹着的内容是不是就是标签体啊?如果你确定你想放直的地方呢?处于标签体当中,OK,你可以用什么呀?插值语法。
11:05
好,咱再说说这个指令语法,同学你发没发现啊,指令语法就目前我写这V纲办的,他貌似呢不管标签题里的事儿是吧?那你说它管理什么呢?哎,同学,管理标签属性,那你发没发现我现在红色框所圈起来的东西都叫做标签属性,你说对吗?那就把我们的总结直接拿回来好了,复制回到这儿呢?走,写好注释,来总结一波吧,各位读一遍view模板语法呢,有两大类,首先第一大类叫做什么呢?差值语法功能用于解析标签体内容,一定注意这个字啊体标签体写法呢,是这样的,双花括号里边写叉叉叉叉叉叉之前聊过了,要写什么呢?GS表达式,而且可以直接读取什么呢?Date中的所有属性,那我目前date里面有几个属性?两个,一个是谁name,一个是谁URL。
12:00
哎,说老师那我这直接写这个URL那可以啊,你就把这个读到页面上去了呗,那你自己瞧呗,就是这样的效果,好了,我们再说指令语法,指令语法就很高级了,各位你看着它的功能啊,非常的强大,你读一读。用于解析标签,同学你听我说啊,我可没在这里边总结的时候,我说用于解析标签属性,我说指令语法用于解析标签,用于解析标签那可包含着很多东西,我解析标签属性是不是标签,是我解析标签题内容是不是解析标签,我甚至给标签绑定事件是不是也叫做解析标签啊,所以说各位指令能完成的功能啊,很强大,那这个时候啊,你可能会说老师啊。那刚才我只见到了你用这个指令去指定标签的标签属性啊,我也没有见到你用V杠办的去解析标签体内容啊,我也没见到你用V杠半的去给标签绑定事件呀,那同学啊,我得说一下,刚才啊,我只是拿V杠半的举个例子,你真想用指令去解析标签体也行,不是这个指令是其他指令,你真想去给标签绑定事件,确实得用指令,但是不是V杠办的是吧?哎,所以说你看我们写了一个备注嘛,View中有很多的指令,且形式都是V杠什么什么,此处呢,我们只是拿V杠半的来举一个例子,对吧?啊,那在这呢,那不就举了一个例子吗?V杠半的HREF,叉叉叉,或者是简写成冒号h ref,哎,叉叉叉,然后呢,叉叉叉同样要写什么呀?GS表达式这块是值得你注意的啊,各位叉叉叉同样要写JS达式,你就比如说各位啊,我给你演示一下你就明白了,瞧着URL是不是全是小写的字母,我想让它是大写的,那咋办?
13:39
很简单嘛,在这写上那个api.To Case对吧?好了,回来看效果,右键检查,瞧着是不是都大写了,那你这如果也想让它大写,把它复制呗,往这一写呗,这不就结了吗?回到这儿看,都大写了是吧?删掉还能这么写?Date点啥意思,当前时间的时间戳对吧?各位,那你瞧一下A标签里边写的啥?
14:04
是不是时间戳啊,说老师,那我要不写这冒号呢,各位你想想不写冒号是什么结局呢?你这里边这一堆东西都不会当成GS表达式去执行的,你说对吧,就是一个最传统的字符串是吧?加了冒号不要紧,View就能帮你去执行,诶这个表达式你说对吧?所以说同学这块呢,你得品味品味,嗯,行,那这块儿呢,我们给他这么写啊,复制过来给他写到这儿,好,那我这个呢,不让他大写上边的呢,让他大写OK。好哎,那我们再升级一下各位,再升级一下,你说人有名字,哎,然后学校呢,有一个网址对吧,各位,那你听我说啊,我看你真懂没懂,再练习一下各位,我想这三个字也是动态的,哎,对,就这上硅谷这三个字也是动态的,你说我得咋办?那简单写呗,是不是也可以写成一个名字,哎,然后叫做闪硅谷,但是我这么写啊,同学就有问题了,就出bug了,你说一个对象里面是不是有两个重名的key呀,那结局就是你看一下。
15:04
他也不会报什么错误,那只不过呀,就是这样来,我把这个呢简单调一下,别写ul了,写什么呢?写name这块我的本意呀是你好Jack啊,然后这个里边的这个name上硅谷呢,那我也这个也得改一下是吧,哎,写上走叫做name,那这呢也得改一下好内哎,本意是这样的是吧,这是hello Jack完了,这个name呢是上硅谷,那你看效果就是全都以你最后写的为主了,对不对,这块这俩是正常了,但是这个他废了呀。那有些同学说老师简单内幕二呗,那这内幕二,那这内幕二这不就解决了吗?回来看Jack还是Jack对吧?上硅谷这样也行,但是同学容易出现它俩冲突啊,那你说这怎么办呀?同学瞧着你把数据的结构呢,设计成多个层级的就好了,什么意思呢?瞧着我还叫内幕,只不过这一堆东西啊,我全放在这里,School什么意思?学校school又是一个对象,对象里面有内幕有什么呢?URL,那各位看看你知不知道怎么写?
16:07
这会我不问你啊,差这语法大家都会,主要是这儿,请问怎么写?我先把这注调一点点来,同学,我直接读URL行不行?哎,你用心里想想行还是不行?答案是不行,为什么?哎,我们说过了啊,这个里边你写JS表达式,这里你也写JS表达式,表达式里边你所写的东西能够自动的看到date中的所有属性,同学,也就是说他能看到谁内还能看到谁,因为我的date里面只有两组K,这是第一组对吗?这是第二组,他看不见这个name和这个ul,那怎么办呀?很简单,你把school拿过来,在这第2UL是不就可以了?是吧,哎,那你这呢,别写NAME2了,School点什么呀?Name这不就得了吗?哎,回头看一下效果刷新,Jack还在上硅谷也在对吧检查诶也变成大写的了,所以说这会儿你要习惯啊,很有可能我们在开发的时候把这东西设计成多级的结构,那这儿呢,给它解开你也知道怎么办了,哎,是school.url哎,那这呢是school点内回来,这不就一切正常了吗?哎,一定这会儿好好去考虑考虑,这个里边写的表面上好像看就是个字符串,实际上它当表达式去执行啊,因为前边有这些东西啊,对不好,那随着我们的学习呢,同学们我们会学到很多很多的指令,那要求大家呢,得有一个好记性,把这些指令呢给它记住,对于差值语法来说,同学,他在没有什么高深的玩法了,哎,就是这么划括号,里边直接写上表达式啊,反正这个你自己掌握好啊,里边写的还是表达式好了,OK,那这一小节呢,我们。
我来说两句