<form class="ui large form segment"> <h3 class="ui header">Add a Link</h3> <div class="field"> <label for="title">Title:</label> <input name="title" #newtitle> </div> <div class="field"> <label for="link">Link:</label> <input name="link" #newlink> </div> <button (click)="addArticle(newtitle,newlink)" class="ui positive right floated button">Submit link</button> </form>
这段标记告诉Angular把这个<input>绑定到变量newtitle上。#newtitle语法被称作一个解析(resolve),其效果是让变量newtitle可用于该视图的所有表达式中。
addArticle(title:HTMLInputElement,link:HTMLInputElement): boolean { console.log(`Adding article title:${title.value} and link:${link.value}`); return false; }
input类型都可以用HTMLInputElement 来解析,将整个DOM元素赋值给newtitle,用以${title.value}相当于DOM.value
${title.value}这个语法需要再调查
2.6.2有解释,ES6新特性模版字符串。
字符串中的变量
这种特性也叫字符串插值(string interpolation)
可以在字符串中设置变量,域内的变量都能直接识别。