AngularJS代码结构.它们有什么不同吗?

AngularJS codes structure. Are they any difference?

本文关键字:什么 代码 结构 AngularJS      更新时间:2023-09-26

新的angularJS,我想知道下面的代码之间的优缺点是什么?推荐使用哪一种?

$routeProvider.when('foo', {
    templateUrl: 'foo.html',
    controller: fooCtrl
    function fooCtrl() {
        //something here
    }
});

$routeProvider.when('foo', {
    templateUrl: 'foo.html'
});
app.controller("fooCtrl", function() {
    //something here
});
//in html
<div ng-controller="fooCtrl"></div>

我更喜欢第二种方法,并在开发应用程序时使用它。这是一种优雅的编码方式,将你的路由配置、模块连接等从控制器中分离出来。我们可以把路由配置写在主文件app中。coffee[我使用coffeescript]定义like

routesConfig = ($route) ->
    $route.when('/employees',
        {templateUrl: 'employee.employeeView.html'})

定义routesconfig和布线模块[例如:employee]。employeeController]。

modules = ['employee.employeeController', 'user.userController']

你可以从这里创建,启动你的angular应用,

m = angular.module('app', modules)
m.config['$route', routesConfig]

现在您可以分别指定控制器,例如在employeeController中。咖啡

name = 'employee.employeeController'
mod = angular.module(name, [])
mod.controller(name, [
    '$scope'
    '$log'
    ($scope, $log) ->
          $scope.name = 'java'

在View中输入employeeView.html

<div ng-controller="employee.employeeController">
 <div class ="info">
  Name is {{name}} 
</div>

基本上我们将控制器,视图,应用程序配置彼此分开。

要对你的问题添加一些具体的内容,

如果您使用第一种方法,那么您可能正在使用控制器作为路由控制器,并在第二种方法,它是一个视图控制器。在这两种情况下,控制器都将为上述路由实例化。

例如,我有一个主页index.html,我在基本的html模板中添加了许多视图(ng-view)。如果你在这个模板中有两个不同的视图部分,说'section1'和'section2',它们都包含在内对于ng-view,您可能需要两个不同的控制器,最好使用第二种方法来定义它们。使用这种类型的控制器用数据、函数、手表等初始化作用域,并使用ng-controller在视图中引用控制器。

如果你有一个节,说'section1'[代表主html页面],包括通过ng-view封装section1和section2,然后那个视图需要路由控制器

不要在一个视图/路由中使用这两种方法,因为这会导致创建同一个控制器的两个实例同样的路线。

我喜欢在这里添加两个链接来详细说明这个(你的查询)并解决这个查询(在两个地方定义控制器的问题)

https://groups.google.com/forum/?fromgroups= !主题/角度/52 ze0iboagk

AngularJS可以为一个$broadcast调用多个$on方法吗?