AngularJS双向绑定和依赖反转实例详解
程序员文章站
2022-09-02 17:15:02
angularjs双向绑定和依赖反转
一、双向绑定：
ui<-->数据
数据->ui （数据改变ui跟着变）
ui->数据 （ui改变数...
angularjs双向绑定和依赖反转
一、双向绑定：
ui<-->数据
数据->ui （数据改变ui跟着变）
ui->数据 （ui改变数据跟着变）
数据改变->ui改变原理：
监听数据是否改变，如果改变更新ui数据。
ui改变->数据改变原理：
<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值改变数据改变
a = otxt.value;
}
}
</script>
</body>
</html>
二、依赖注入：
函数可以自己决定需要什么数据或者多小个数据，而不是外面传什么就用什么。
2.1、调用者决定给多小个参数
<script>
function show(a,b,c){
console.log(arguments.length);
}
show(1); //调用者只给1个参数，调用者决定参数的给予。
</script>
2.2、依赖注入（依赖反转）：函数要求要多小参数，就给多小。 就像show(a,b,c)要求3个参数
<script>
function show(a,b,c){
console.log(arguments.length);
}
var scope = {a:12,b:15,c:99,qq:55,i:99}; //假设是函数需要的参数
//实现依赖反转二个步骤
//1、知道show要什么参数
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、给它相应值
var args=[];
for(var i=0;i<arr.length;i++){
args[i]=scope[arr[i]];
}
console.log(args);
show.apply(null,args);
</script>
感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！
上一篇： 基于Redis实现限制登录功能