首页 > 其他分享 >angular_$inject

angular_$inject

时间:2023-01-13 15:32:28浏览次数:44  
标签:function msgs notify msg noti angular inject

<!DOCTYPE HTML>
<html lang="zh-cn" ng-app="MainApp">
<head>
<meta charset="UTF-8">
<title>explicit-inject-service</title>
</head>
<body>
<div ng-controller="MyController">
<input type="text" ng-model="msg"/>
<button ng-click="saveMsg()">save msg</button>
<ul>
<li ng-repeat="msg in msgs">{{msg}}</li>
</ul>
</div>>
<script src="js/angular.js" type="text/javascript"></script>
<script type="text/javascript">
var app = angular.module("MainApp",[],function($provide) {
$provide.factory("notify",["$window","$timeout",function(win,timeout) {
//这里是服务依赖服务,通过这种显式的方式,参数名可以乱填,但顺序要对应
var msgs = [];
return function(msg) {
msgs.push(msg);
if(msgs.length==3) {
timeout(function() {
win.alert(msgs.join("\n"));
msgs = [];
},10);
}
}
}]);
});

function MyController($s,$noti) {
//这里是controller依赖服务,通过这种显式的方式,参数名可以乱填,但顺序要对应
$s.msgs = [];
$s.saveMsg = function() {
this.msgs.push(this.msg);
$noti(this.msg);
this.msg = "";
};
}

//这个就是让controller里面的$s指向$scope,$noti指向notify这个服务
MyController.$inject = ['$scope','notify'];
  //有显示依赖和隐示依赖
</script>
</body>
</html>

  

天道酬勤



标签:function,msgs,notify,msg,noti,angular,inject
From: https://blog.51cto.com/u_12304260/6006084

相关文章

  • Angularjs——初识AngularJS
    AngularJS——初识AngularJSAngularJS是什么AngularJS是Google开源的一款前端JS结构化框架,它通过对前端开发进行分层,极好地规范了前端开发的风格——它将前端开发分为Con......
  • Angular集成bpmn.js的基础实现及扩展(一)
    一、bpmn的基本认识bpmn.js是一个BPMN2.0渲染工具包和web建模器,使得画流程图的功能在前端来完成。bpmn画图具有哪些内容?二、使用npm安装bpmn.jsnpminstall--sav......
  • es7 依赖注入(Dependency Injection, DI)
    ES7中的依赖注入是一种技术,用于解决模块之间的耦合性问题。它允许我们将模块之间的依赖关系抽象化,从而使它们更容易重构,测试和更新。它也可以帮助我们更好地管理应用程序......
  • TypeScript 2.0 与 AngularJS 2.0 的最新动态
    Lightbot微软终于发布了TypeScript2.0的第一个RC版本。TypeScript是一个简化版的JavaScript语言,被大量用于各种Web项目,包括下面提到的著名的AngularJS框架......
  • Consider injecting the bean as one of its interfaces or forcing the use of CGLib
    背景今天在写一个数据处理程序的时候,我打算优化一下我的程序,本来是直接用Mapper层进行单行记录保存的,也就是调用的Mapper的insert函数过程然后我就写了一......
  • Vue3 中的组件 provide和inject 传值、获取组件实例的方法getCurrentInstance()
     一、 provide和inject1:在父级组件中提供数据     语法:provide('提供给子组件的变量名',提供给子组件的数据)   2:在子级组件中获取收据  ......
  • angularJS友好URL实现 good
    nginx部署angularjs时的rewrite问题使用h5+angularjs完成了一个项目此项目在正式环境上使用nginx做webserver此项目的入口在微信/微博分享中由于分享时的项目访问地址中......
  • DVWA靶场实战(二)——Command Injection
    DVWA靶场实战(二)二、CommandInjection:1.漏洞介绍:CommandInjection,中文叫做命令注入,是指通过提交恶意构造的参数破坏命令语句结构,从而达到执行恶意命令的目的。PH......
  • angular与vue对比
     之前一直用angular开发项目,最近使用vue开发了一个网站,还是习惯找双方的共同点,以下是在项目过程中总结的差异。 ......
  • 使用Gradle整合angular和Spring boot
    前言本文讲述如何使用Gradle搭建一个以springboot技术栈作为后端,使用Angular作为前端技术栈,同过gradle将其整合成一个项目的实践经验.这里只是作为一种实践,并不建......