Angularjs中數據綁定的實例詳解
這是一個最簡單的angularjs的例子,關于數據綁定的,大家可以執行一下,看看效果
<html ng-app><head><title>angularjs-include</title><script type="text/javascript" src="js/angular/angular.min.js"></script></head><body><input type="text" ng-model="name" value="" /><br /><div>Hello,{{name}}</div></body></html>
關于數據雙向綁定,有時候不需要實時同步,比如當輸入框失去焦點的時候才去更新div里面的內容,這里可以用上ng-model-options屬性來解決,將上面的代碼稍做修改:
<html ng-app><head><title>angularjs-include</title><script type="text/javascript" src="js/angular/angular.min.js"></script></head><body><input type="text" ng-model="name" value="" ng-model-options="{ updateOn: 'blur' }" /><br /><div>Hello,{{name}}</div></body></html>
或者改為每隔1秒來更新:
<html ng-app><head><title>angularjs-include</title><script type="text/javascript" src="js/angular/angular.min.js"></script></head><body><input type="text" ng-model="name" value="" ng-model-options="{ debounce: {default:1000} }" /><br /><div>Hello,{{name}}</div></body></html>
如有疑問請留言或者到本站社區交流討論,大家共同進步,感謝閱讀,希望能幫助到大家,謝謝大家對本站的支持!
新聞熱點
疑難解答