我們先看一個實例:
<!DOCTYPE html><html lang="en" ng-app><head> <meta charset="UTF-8"> <title>Document</title></head><body> <input type="text" ng-model="name" placeholder="請輸入名字"/> <h1>{{name}}</h1></body><script type="text/javascript" src="https://cdnjs.cloudflare.com/Ajax/libs/angular.js/1.6.1/angular.min.js"></script><script type="text/Javascript"> </script></html>實現的功能:隨著input內容的改變動態改變h1里面的內容
原生JavaScript實現方式:給input定義一個onchange事件并且調用一個操作DOM的函數(比較麻煩)
angular實現實現方式:只需要一個ng-model指令就可以完成,不需要寫任何js代碼
應用場景:輸入框類交互任務時
新聞熱點
疑難解答