AngularJS应用程序组件(模块,工厂,控制器)的定义究竟如何?

时间:2015-12-13 10:59:53

标签: javascript angularjs javascript-objects angularjs-controller angularjs-factory

我是AngularJS中的新手,也是JavaScript中的新手,我对此示例的相关疑问显示在教程中:

// Creates values or objects on demand
angular.module("myApp")     // Get the "myApp" module created into the root.js file (into this module is injected the "serviceModule" service
.value("testValue", "AngularJS Udemy")

// Define a factory named "courseFactory" in which is injected the testValue
.factory("courseFactory", function(testValue) {
    // The factory create a "courseFactory" JSON object;
    var courseFactory = {
            'courseName': testValue,    // Injected value
            'author': 'Tuna Tore',
             getCourse: function(){     // A function is a valid field of a JSON object
             alert('Course: ' + this.courseName);   // Also the call of another function
            }
          };    
    return courseFactory;       // Return the created JSON object
})

// Controller named "factoryController" in which is injected the $scope service and the "courseFactory" factory:
.controller("factoryController", function($scope, courseFactory) {
    alert(courseFactory.courseName);        // When the view is shown first show a popupr retrieving the courseName form the factory
    $scope.courseName = courseFactory.courseName;
    console.log(courseFactory.courseName);
    courseFactory.getCourse();  // Cause the second alert message
});

我很清楚它做了什么:它创建了一个代表我的应用程序的角度模块,名为 myApp 。然后定义一个值,一个工厂(返回 courseFactory JSON对象),最后是一个注入上一个工厂的控制器。

认为我不清楚这些"组件的声明的语法是什么。

所以,在我看来,"语法"是这样的:

angular.module("myApp").value(VALUE DECLARATION).factory("courseFactory", function(testValue) { RETURN THE JSON OBJECT IMPLEMENTING THE FACTORY }).controller("factoryController", function($scope, courseFactory) { IMPLEMENT THE CONTROLLER });

所以我的疑问是:为什么所有"组件" (声明,工厂实施和控制器实施)在" concatentaion链中定义" "。" symbol将这些组件添加到链中?

这究竟是什么意思"。" ?

我认为它会在对象或类似的东西中添加一个字段,但这对我来说似乎很奇怪。

首先是角度对象(它是一个对象还是什么?)上添加了模块(" myApp")& #34;组分" (这似乎是逻辑,因为我正在向Angular添加一个模块)。

然后添加作为此模块的属性。而且它似乎也有意义,因为我在特定的模块中添加了

但为什么工厂添加为此的字段,然后控制器添加为此的字段工厂

我认为我错过了一些东西。

我错过了什么?如何使用AngularJS"组件"定义

1 个答案:

答案 0 :(得分:1)

以下内容:

angular.module("myApp")

将返回代表模块的对象。

您可以通过执行以下操作来检查:

console.log(angular.module("myApp"));

您将看到此对象包含许多方法,例如valuecontrollerfactory

这解释了为什么您可以执行以下操作:

angular.module("myApp").value("testValue", "AngularJS Udemy");

诀窍在于value方法还返回模块对象,因此您可以继续链:

angular.module("myApp").value("testValue", "AngularJS Udemy").factory(...)

模块对象上的其他方法也是如此。

让方法像这样返回主对象是允许这种链接的常用技术。

你可以这样读:

var myModule;

myModule = angular.module('myApp'); // Returns the module

myModule = myModule.value(...); // Registers a value and returns the module

myModule = myModule.factory(...); // Registers a factory and returns the module