未知提供者:ngModelProvider

用户名

我试图注入ngModelAngular指令,但出现此错误:

Error: [$injector:unpr] Unknown provider: ngModelProvider <- ngModel
http://errors.angularjs.org/1.2.18/$injector/unpr?p0=ngModelProvider%20%3C-%20ngModel
    at http://localhost:2013/Scripts/angular.js:78:12
    at http://localhost:2013/Scripts/angular.js:3741:19
    at Object.getService [as get] (http://localhost:2013/Scripts/angular.js:3869:39)
    at http://localhost:2013/Scripts/angular.js:3746:45
    at getService (http://localhost:2013/Scripts/angular.js:3869:39)
    at invoke (http://localhost:2013/Scripts/angular.js:3896:13)
    at Object.instantiate (http://localhost:2013/Scripts/angular.js:3917:23)
    at $get (http://localhost:2013/Scripts/angular.js:7201:28)
    at http://localhost:2013/Scripts/angular.js:6592:34
    at forEach (http://localhost:2013/Scripts/angular.js:327:20) angular.js:9937
(anonymous function) angular.js:9937
$get angular.js:7283
$get.Scope.$digest angular.js:12414
$get.Scope.$apply angular.js:12660
done angular.js:8272
completeRequest angular.js:8477
xhr.onreadystatechange

这是我的指令:

module.directive("myDatePicker", function () {
    return {
        restrict: "A",
        template: '<p class="input-group" title="{{title}}">' +
                            '<input type="text" class="form-control" data-datepicker-popup="{{dateFormat}}" ng-model="selectedDate" data-is-open="isOpen" data-datepicker-options="dateOptions" ng-required="true" data-close-text="{{closeText}}" />' +
                            '<span class="input-group-btn">' +
                                '<button type="button" class="btn btn-default" ng-click="open($event)"><i class="glyphicon glyphicon-calendar"></i></button>' +
                            '</span>' +
                        '</p>',
        replace: true,
        require: '?ngModel',
        //priority: 0,
        scope: {
            title: "@",
            selectedDate: "=ngModel",
            onChange: "&",
            dateFormat: "="
        },
        compile: function (tElement, tAttrs, transclude) {
            // Correct ngModel for isolate scope
            if (tAttrs.ngModel) {
                tAttrs.$set('selectedDate', tAttrs.ngModel, false);
                tAttrs.$set('ngModel', 'selectedDate', false);
            }

            return {
                post: function (scope, iElement, iAttrs, controller) {
                    // Render
                    return controller.$render = function () {
                        if (!controller.$viewValue) {
                            return;
                        }
                        angular.extend(scope, controller.$viewValue);
                    };
                }
            };
        },
        priority: 100,
        link: function (scope, elem, attr) {
        },
        controller: function ($scope, global, ngModel) {
            $scope.isOpen = false;
            $scope.closeText = 'Close';
            $scope.dateOptions = {};

            $scope.open = function ($event) {
                $event.preventDefault();
                $event.stopPropagation();
                $scope.isOpen = true;
            };

            $scope.$watch(function () {
                return $scope.selectedDate;
            },
                function (newValue, oldValue) {
                    ngModel.$setValidity('required', newValue == true);
                    $scope.onChange({ newDate: newValue, oldDate: oldValue });
                }, true);
        }
    };
});

这是我的HTML:

                    <input data-my-date-picker
                           id="EventDatePicker" data-name="EventDatePicker"
                           data-date-format="dateFormat"
                            ng-model="EventDetails.Date"
                           ng-required="true"
                           data-title="Date" />

为什么无法解决?我尝试这样做:

module.directive("myDatePicker", ['ngModel', function () {

...但没有帮助。

我也尝试过删除priority,但也无济于事。

它与指令的加载顺序有关吗?

我在这里想念什么?

有任何想法吗?


最终,根据sma的建议,我做到了:

        require: ['^ngModel'/*, '^isDate'*/],
        scope: {
            title: "@?",
            name: "@?"
        },
        link: function (scope, elem, attr, ngModel/*, isDate*/) {
        ...

这种似乎有效。

我不确定为什么不能将其注入控制器中。:(

一定有办法,但我还没有找到……

但是由于某些奇怪的原因,isDate仍然不会注入上述指令(尽管它们是在当前指令之前定义的)。

这很令人困惑。

中学

您的参数在控制器函数中是错误的。控制器功能接受:

controller : function ($scope, $element) {
   ...    
}

如果您尝试将ngModel注入为依赖项,请改用link函数:

link : function(scope, element, attrs, ngModelController) {
   ...
}

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

未知提供者:ngModelProvider

来自分类Dev

未知提供者:$ controller

来自分类Dev

未知的提供者CookieStore

来自分类Dev

未知的提供者:$ ionicAppProvider

来自分类Dev

未知提供者:$ state

来自分类Dev

uiSelect未知提供者

来自分类Dev

未知提供者:$ cordovaSQLiteProvider

来自分类Dev

未知提供者:acordionDirectiveProvider

来自分类Dev

未知的提供者CookieStore

来自分类Dev

Heroku未知提供者

来自分类Dev

指令提供者未知

来自分类Dev

未知提供者:$ routeParamsProvider

来自分类Dev

AngularJS未知提供者

来自分类Dev

未知的提供者AngularJS

来自分类Dev

未知提供者:$ controller

来自分类Dev

未知提供者:$ state

来自分类Dev

$ cordovaInstagram返回未知的未知提供者

来自分类Dev

未知提供者:$ modalInstanceProvider <-$ modalInstance

来自分类Dev

AngularJS中的未知提供者$ sce

来自分类Dev

未知提供者:ngTagsInputProvider <-ngTagsInput

来自分类Dev

错误:未知提供者:employeesProvider <-雇员

来自分类Dev

业障测试中的未知提供者

来自分类Dev

未知提供者:$ uploadProvider <-$ upload

来自分类Dev

未知提供者:$ resourceProvider-AngularJS

来自分类Dev

Angular / Karma:未知提供者

来自分类Dev

查找“未知提供者”错误的原因

来自分类Dev

AngularJS [$ injector:unpr]未知的提供者

来自分类Dev

未知提供者:tProvider <-t

来自分类Dev

未知提供者:$ firebaseProvider <-$ firebase