Angularjs Angulajs在指令中使用或注入服务

Angularjs Angulajs在指令中使用或注入服务,angularjs,angularjs-directive,angularjs-service,Angularjs,Angularjs Directive,Angularjs Service,我对使用angularjs是新手。我已经在seprate文件中创建了一个指令和服务。当我将服务包括到指令中时,出现错误:[$injector:modulerr] 以下是我的文件结构和文件:- 指令:-视频课程.js videoCourseApp.directive('mcssForm' ,function(){ return{ restrict : 'C', templateUrl : 'assets/template_blocks

我对使用angularjs是新手。我已经在seprate文件中创建了一个指令和服务。当我将服务包括到指令中时,出现错误:[$injector:modulerr]

以下是我的文件结构和文件:-

指令:-视频课程.js

videoCourseApp.directive('mcssForm' ,function(){
        return{
            restrict : 'C',
            templateUrl : 'assets/template_blocks/mcss_form.html',
            link: function(scope,element,attribute){
            }
        };
});

videoCourseApp.directive('addNewMsccOption', function(incrementId){
        return{
            replace: true,
            restrict : 'C',
            template : '<li><input name="test" type="radio" ng-model="videoCourseQuestions.mcss_option"/><input ng-model="videoCourseOptions.Option{{newid}}" type="text"   class="option"  placeholder = "Enter your Option{{newid}}" />',
            link: function(scope,element,attribute){
                scope.newid = incrementId.getAndIncrement;
            }
        };
    });
最后是我的主app.js文件,其中定义了所有方法:-

var videoCourseApp = angular.module('videocourse' , ['ngDragDrop','mcssForm','addNewMsccOption']);

videoCourseApp.controller('video_course_add_question',function($scope, $timeout, $compile){


});
这是我的index.html文件:->

<script src="assets/js/video_course/app.js"></script>
<script src="assets/js/directives/video_course.js"></script>
<script src="assets/js/services/video_services.js"></script>


这将导致喷油器模块出现错误。问题在哪里?我如何以正确的方式管理这些依赖关系。

您的问题在于如何定义模块。当所有这些指令都已在同一模块中时,您正在将这些指令作为依赖项添加到模块videoCourseApp。只有使用模块字定义的模块才能作为模块的依赖项注入。因此,请尝试从模块防御中删除这些指令


希望有帮助

您的代码应该更像:

var videoCourseApp = angular.module('videocourse' , ['ngDragDrop']);

videoCourseApp.controller('video_course_add_question', ['$scope', '$timeout', '$compile', function($scope, $timeout, $compile){


}]);

videoCourseApp.service('incrementId', function(){
        var index = 4;
        this.getAndIncrement = function () {
        return index++;
    };
});

videoCourseApp.directive('addNewMsccOption', ['incrementId', function(incrementId){
    return{
        replace: true,
        restrict : 'C',
        template : '<li><input name="test" type="radio" ng-model="videoCourseQuestions.mcss_option"/><input ng-model="videoCourseOptions.Option{{newid}}" type="text"   class="option"  placeholder = "Enter your Option{{newid}}" />',
        link: function(scope,element,attribute){
            scope.newid = incrementId.getAndIncrement;
        }
    };
}]);

videoCourseApp.directive('mcssForm' ,function(){
    return{
        restrict : 'C',
        templateUrl : 'assets/template_blocks/mcss_form.html',
        link: function(scope,element,attribute){
        }
    };
});
var videoCourseApp=angular.module('videocourse',['ngDragDrop']);
videoCourseApp.controller('video\u course\u add\u question',['$scope','$timeout','$compile',函数($scope,$timeout,$compile){
}]);
videoCourseApp.service('incrementId',function(){
var指数=4;
this.getAndIncrement=函数(){
返回索引++;
};
});
videoCourseApp.指令('AddNewMSCcopion',['incrementId',函数(incrementId){
返回{
替换:正确,
限制:“C”,
模板:“
  • ”, 链接:函数(范围、元素、属性){ scope.newid=incrementId.getAndIncrement; } }; }]); videoCourseApp.指令('mcssForm',函数(){ 返回{ 限制:“C”, templateUrl:'assets/template_blocks/mcss_form.html', 链接:函数(范围、元素、属性){ } }; });

  • 请注意控制器和指令定义中的依赖项注入和缩小设置。

    您是否在index.htmlYes中包含了videoservice.js`i:-@pankajparkar您到底得到了什么错误?未捕获错误:[$injector:modulerr]…p%3A%2F%2Flocalhost%2Fvideo\u课程%2Fassets%2Fjs%2Fangular.min.js%3A32%3A9)@Omar.Alaniclcik在错误创建的链接上将向您解释自己…或者使用开发版本进行详细错误和堆栈跟踪输出
    var videoCourseApp = angular.module('videocourse' , ['ngDragDrop']);
    
    videoCourseApp.controller('video_course_add_question', ['$scope', '$timeout', '$compile', function($scope, $timeout, $compile){
    
    
    }]);
    
    videoCourseApp.service('incrementId', function(){
            var index = 4;
            this.getAndIncrement = function () {
            return index++;
        };
    });
    
    videoCourseApp.directive('addNewMsccOption', ['incrementId', function(incrementId){
        return{
            replace: true,
            restrict : 'C',
            template : '<li><input name="test" type="radio" ng-model="videoCourseQuestions.mcss_option"/><input ng-model="videoCourseOptions.Option{{newid}}" type="text"   class="option"  placeholder = "Enter your Option{{newid}}" />',
            link: function(scope,element,attribute){
                scope.newid = incrementId.getAndIncrement;
            }
        };
    }]);
    
    videoCourseApp.directive('mcssForm' ,function(){
        return{
            restrict : 'C',
            templateUrl : 'assets/template_blocks/mcss_form.html',
            link: function(scope,element,attribute){
            }
        };
    });