在指令模板中使用帶有表達式的ng-model的角度

Question

我想在自定義元素中使用ng-model屬性。問題是，我需要設置NG-模型的表達式：

ng-model="{{anyVariable}}" 

的問題是，我始終會盡快得到一個錯誤，我的表達添加到模板中的NG-模型屬性：

Error: Syntax Error: Token 'x.name' is unexpected, expecting [:] at column 3 of the expression [{{x.name}}] starting at [x.name}}]. 
    at Error (<anonymous>) 
    at throwError (http://localhost:9000/public/javascripts/angular.js:5999:11) 
    at consume (http://localhost:9000/public/javascripts/angular.js:6037:7) 
    at object (http://localhost:9000/public/javascripts/angular.js:6327:9) 
    at primary (http://localhost:9000/public/javascripts/angular.js:6211:17) 
    at unary (http://localhost:9000/public/javascripts/angular.js:6198:14) 
    at multiplicative (http://localhost:9000/public/javascripts/angular.js:6181:16) 
    at additive (http://localhost:9000/public/javascripts/angular.js:6172:16) 
    at relational (http://localhost:9000/public/javascripts/angular.js:6163:16) 
    at equality (http://localhost:9000/public/javascripts/angular.js:6154:16) 

使用的代碼：

function addFormFieldDirective(elementName, template) { 
    app.directive(elementName, function() { 
     return { 
      restrict: "E", 
      scope: {}, 
      replace: true, 
           // adds some extra layout 
      template: buildFormTemplate(template), 
      link: function(scope, elm, attrs) { 
       scope.x = attrs; 
      } 
     }; 
    }); 
} 
addFormFieldDirective("textfield", '<input id="{{x.id}}" ng-model="{{x.name}}" type="text" name="{{x.name}}" value="{{x.value}}" />'); 

Answer 1

我無法找到一個方法來表達傳遞給ng-model指令模板內。

繼溶液創建指令和指令controller動態創建在主控制器模型對象中的屬性名稱內的分離的模型和手錶的分離的模型來更新傳遞給主模型：

app.directive("textfield", function() { 
    return { 
     restrict: "E", 
     scope: {}, 
     replace: true, 
     controller:function($scope,$attrs) { 
      $scope.x=$attrs; 

      $scope.$watch('directiveModel',function(){ 
       $scope.$parent.myModel[$attrs.name]=$scope.directiveModel; 
      }) ; 

      $scope.directiveModel=$attrs.value; 
     }, 
     template: buildFormTemplate('<input ng-model="directiveModel" id="{{x.id}}" type="text" name="{{x.name}}" value="{{x.value}}" />'); 

    }; 
}); 

Plunkr Demo

Answer 2

嘗試其中一個版本：

.directive('myDir', function() { 
    return { 
     restrict: 'EA', 
     scope: { 
        YYY: '=ngModel' 
        }, 
     require: 'ngModel', 
     replace: true, 
     template: '<input ng-model="YYY" />' 
    }; 
});