AngularJS依赖注入示例

AngularJS依赖注入示例

需求解释 在页面的视图模中，添加4个文本不同的按钮，通过依赖注入的方式，向控制器注入多个依赖对象，当单击按钮时，根据选择的对象不同，将在页面的< div >元素中将显示不同的问候内容。

先贴代码在解释

②在这个服务中包含了几个重要的方法，如provider、factory、service和value;而这些方法都有一个相同的功能，那就是通过服务创建一个自定义的依赖注入对象。

③先通过$provide服务中provider()、factory()、value()、service()方法分别在模块中定义名称为”show_1”、”show_2”、”show_3”和”show_4”的可注入型变量,而这些变量又分别对应一个函数,这些函数的功能都是相同的,即返回返回用户输入的内容。

④在定义模板中控制器层代码时,将这些定义好的变量全部作为依赖注入变量来使用。

⑤当页面在解析这段代码时,Angular将启动$provide服务，并返回多个服务一一对应的实例,通过这些实例分别处理这些注入变量对应的函数功能。

⑥对于开发者来说，只要改变注入变量就行了。

⑦最后,在控制器代码中定义一个绑定页面的按钮的onClick函数,并在该函数中添加一个”t”参数,用于区分不同的按钮,程序根据该参数的值，调用不同的依赖注入变量对应的方法.

⑧因此，当单击页面中不同的按钮时,传来不同实参”t”的值，并将处理后的参数内容显示在页面中。

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。