javascript - Angular提示缺少一个尚未声明的模块

我正在尝试定义两个角度模块myApp1和myApp2。

从myApp1开始，我正在使用myApp2的服务。

这是我在JSfiddle中尝试过的

html

<div ng-app="myApp1" ng-controller="mycontroller">
    {{saycheese}}
</div>

js

var myApp2 = angular.module('myApp2', []);
var myApp1 = angular.module('myApp1', []);

myApp1.service('myservice', function() {
    this.sayHello = function(test) {
        return "from service" + test;
    };
    this.sayHello1 = function() {
            return "from service - sayHello1"
    };
});

myApp2.service('myservice2', function() {
        this.sayCheese = function(test) {
             return "from service of myApp2" + test;
    };
});

myApp1.factory('myfactory', function() {
    return {
        sayHello: function() {
            return "from factory!"
        }


    };
});

//defining a controller over here
myApp1.controller("mycontroller", ["$scope", "myfactory", "myservice", "myservice2", function($scope, myfactory, myservice, myservice2) {

    $scope.saycheese = [
        myfactory.sayHello(),
        myservice.sayHello("abcd"),
        myservice.sayHello1(),
        myservice2.sayCheese("abcdefghij!")
        ];

}]);

但是，当我检查控制台日志时，angular抱怨no module: myApp。

JSfiddle在这里http://jsfiddle.net/PxdSP/3050/

有人可以帮我弄这个吗 ？

最佳答案

这是命名约定的问题，您不能在模块名称中使用数字。我将它们重命名为myApp1 -> myApp & myApp2 -> myApptwo。
第二个问题是您没有在myApptwo中注入myApp，否则您将无法访问myApptwo的服务

var myApptwo = angular.module('myApptwo', []);
var myApp = angular.module('myApp', ['myApptwo']);

myApp.service('myservice', function() {
    this.sayHello = function(test) {
        return "from service" + test;
    };
    this.sayHello1 = function() {
    		return "from service - sayHello1"
    };
});

myApptwo.service('myservice2', function() {
		this.sayCheese = function(test) {
    		 return "from service of myApp2" + test;
    };
});

myApp.factory('myfactory', function() {
    return {
        sayHello: function() {
            return "from factory!"
        }


    };
});

//defining a controller over here
myApp.controller("mycontroller", ["$scope", "myfactory", "myservice", "myservice2", function($scope, myfactory, myservice, myservice2) {

    $scope.saycheese = [
        myfactory.sayHello(),
        myservice.sayHello("abcd"),
        myservice.sayHello1(),
        myservice2.sayCheese("abcdefghij!")
        ];

}]);

<div ng-app="myApp" ng-controller="mycontroller">
    {{saycheese}}
</div>