Javascript AngularJS-如何更改自定义指令中ngModel的值？

让我们看看我的指令：

angular.module('main').directive('datepicker', [
function() {
    return {
        require: '?ngModel',
        link: function(scope, element, attributes, ngModel) {
            ngModel.$modelValue = 'abc'; // this does not work
            // how do I change the value of the model?

---

那么，如何更改ng模型的值呢？

您尝试的方法实际上是有效的：

您不会在输入中“看到”它，因为以这种方式更改模型不会调用

控制器。$render（）

来设置新的

控制器。$viewValue

但是为什么不简单地更改

$scope

值（除非您不知道，但这会很奇怪）：

在您的html中：

<input ng-model="yourVariable" datepicker>

---

要使用复杂的绑定表达式，应该使用服务和

assign

方法

有关更多信息，请观看来自ng conf的视频-这是关于使用ng model指令可以做的最酷的事情：

---

这适用于我的网站上的

日期选择器

link: function(scope, elem, attrs, ngModel) {
         scope.$apply(function(){
             ngModel.$viewValue = value;
         }
} 

---

有不同的方法可以做到这一点：

$setViewValue（）

更新视图和模型。在大多数情况下，这就足够了

如果要断开视图与模型的连接（例如，模型是一个数字，而视图是一个带有数千个分隔符的字符串），则可以直接访问

$viewValue

和

$modelValue

如果您还想覆盖

ng model

的内容（例如，指令更改小数位数，同时更新模型），请在作用域上插入

ngModel:'='

，并设置

scope.ngModel

e、 g

链接：

• 讨论了第一种选择
• 公文

---

这是我遇到的最好的解释。这帮了我很大的忙，并汇集了许多其他答案的细节
小贴士：仔细阅读整篇文章，而不是略读，否则你可能会错过一些关键的部分

---

为什么不更改

$scope

相关值？现在我只使用了

$modelValue

来阅读它。顺便说一句，link函数的第四个属性是

ngModelController

，在您的例子中，您应该称它为

controller

；）@glepretre，我怎么能使用scope？模型是这样通过html传递的
，我不知道该模型的名称，无法在作用域中使用它。关于

控制器

呼叫。看看这个，他们怎么称呼它。但这也是错误的，我认为最好的名称可能是

ngModelCtrl

我尝试了这里的所有解决方案，但都不起作用：（但如果我将
更改为
。指令将如何反应？注意，我需要可重用指令您的指令是可重用的，但

ng model=“foo”

必须匹配

$scope.foo

才能工作，这就是重点。我编辑我的答案是为了提供另一个解决方案，使其更具动态性。它仍然不够可重用。如果我使用复杂模型作为

用户[0]。教育[1]。名称

？如果您的ngModel像“objectOnScope.nestedValue”一样绑定到smth，它将不起作用@AlexLapa是的，我知道，这在问题中不是必需的。这就是为什么我在回答中没有使用

$parse

，但我是一个公平的参与者，我比Sly_cardinal的更高：）我尝试了这个，但仍然没有在页面上更新模型。你能发布你的html吗？我很绝望，这是我的问题啊！最后谢谢“布拉”！我错过了ngModel的范围：'='

angular.module('main').directive('datepicker', [function() {
    return {
        require: '?ngModel',
        link: function(scope, element, attributes, controller) {
          // get the value of the `ng-model` attribute
          var model = attributes['ngModel'];

          // update the scope if model is defined
          if (model) {
            scope[model] = 'bar';
          }
        }
    };
}]);

app.directive('datepicker', ['$parse',
    function($parse) {
        return {
            require: '?ngModel',
            link: function(scope, element, attributes, controller) {
                // $parse works out how to get the value.
                // This returns a function that returns the result of your ng-model expression.
                var modelGetter = $parse(attributes['ngModel']);
                console.log(modelGetter(scope));

                // This returns a function that lets us set the value of the ng-model binding expression:
                var modelSetter = modelGetter.assign;

                // This is how you can use it to set the value 'bar' on the given scope.
                modelSetter(scope, 'bar');

                console.log(modelGetter(scope));
            }
        };
    }
]);

link: function(scope, elem, attrs, ngModel) {
         scope.$apply(function(){
             ngModel.$viewValue = value;
         }
} 

  return {
     restrict: 'A',
     require: 'ngModel',
     scope: {
         ngModel: '='
     },
     link: function (scope, element, attrs, ngModelCtrl) {

        function updateView(value) {
            ngModelCtrl.$viewValue = value;
            ngModelCtrl.$render(); 
        }

        function updateModel(value) {
            ngModelCtrl.$modelValue = value;
            scope.ngModel = value; // overwrites ngModel value
        }
 ...