AngularJS雙向綁定和依賴反轉(zhuǎn)
一、雙向綁定:
UI<-->數(shù)據(jù)
數(shù)據(jù)->UI (數(shù)據(jù)改變UI跟著變)
UI->數(shù)據(jù) (UI改變數(shù)據(jù)跟著變)
數(shù)據(jù)改變->UI改變?cè)恚?/p>
監(jiān)聽(tīng)數(shù)據(jù)是否改變,如果改變更新UI數(shù)據(jù)。
UI改變->數(shù)據(jù)改變?cè)恚?/p>
<html><body><input type="text" name="name" value="" id="text1" ng_model="a"><script>window.onload = function(){var a='';var oTxt = document.getElementById('text1');oTxt.oninput = function(){ //UI值改變數(shù)據(jù)改變a = oTxt.value;}}</script></body></html> 二、依賴注入:
函數(shù)可以自己決定需要什么數(shù)據(jù)或者多小個(gè)數(shù)據(jù),而不是外面?zhèn)魇裁淳陀檬裁础?/p>
2.1、調(diào)用者決定給多小個(gè)參數(shù)
<script>function show(a,b,c){console.log(arguments.length);}show(1); //調(diào)用者只給1個(gè)參數(shù),調(diào)用者決定參數(shù)的給予。</script>2.2、依賴注入(依賴反轉(zhuǎn)):函數(shù)要求要多小參數(shù),就給多小。 就像show(a,b,c)要求3個(gè)參數(shù)
<script>function show(a,b,c){console.log(arguments.length);}var scope = {a:12,b:15,c:99,qq:55,i:99}; //假設(shè)是函數(shù)需要的參數(shù)//實(shí)現(xiàn)依賴反轉(zhuǎn)二個(gè)步驟//1、知道show要什么參數(shù)var str = show.toString();str=str.split('{')[0].match(//(.*)//)[0].replace(//S+/g,'');str=str.substring(1,str.length-1);var arr=str.split(',');//2、給它相應(yīng)值var args=[];for(var i=0;i<arr.length;i++){args[i]=scope[arr[i]];}console.log(args);show.apply(null,args);</script>感謝閱讀,希望能幫助到大家,謝謝大家對(duì)本站的支持!
新聞熱點(diǎn)
疑難解答
圖片精選