angularJs模版注入的两种方式

最新推荐文章于 2025-08-15 09:01:53 发布

转载最新推荐文章于 2025-08-15 09:01:53 发布 · 386 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/dasenglin/p/5529660.html

文章标签：

#javascript #ViewUI

本文详细介绍了AngularJS中两种依赖注入的方式：声名式注入和直接注入。通过具体的代码示例，展示了如何在app.js、controller.js及config.js等文件中进行依赖注入，并配置路由。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一，声名式注入

1:app.js:

var myApp = angular.module("myApp",["ngRoute"]);

2:controller.js:

myApp.controller("indexCtrl",['$scope',function($scope){ //如果想用混淆，必须使用中括号中声名注入参数

}])

3:config.js:

myApp.config(function($routeProvider, $locationProvider) {
   $routeProvider
   .when('/a', {
       templateUrl: 'web/templates/a.html',
       controller: 'aController'
   })
   .when('/b', {
       templateUrl: 'web/templates/b.html',
       controller: 'bController',
   .otherwise({
       redirectTo: '/a'
   });
});

二，直接注入

1:app.js

angular.moudle("myApp",[

　　'ngRoute',

　　'myApp.config',

'myApp.controllers'

]);

2:controllers.js

angular.module("myApp.controllers",[]) //如果想用混淆，必须使用中括号中声名注入参数

.controller("myCtrl",function($scope){

})

.controller("otherCtrl",function($scope){

})

3:config.js

angular.module("myApp.config",[])

.config(function($routeProvider, $locationProvider) {
   $routeProvider
   .when('/a', {
       templateUrl: 'web/templates/a.html',
       controller: 'aController'
   })
   .when('/b', {
       templateUrl: 'web/templates/b.html',
       controller: 'bController',
   .otherwise({
       redirectTo: '/a'
   });
});

转载于:https://www.cnblogs.com/dasenglin/p/5529660.html