Kątowe za pomocą modelu ng z wyrażeniem w szablonie dyrektywy

Question

Chcę użyć atrybutu ng-model w niestandardowym elemencie. Problemem jest to, że muszę ustawić NG-modelu z wyrazem:

ng-model="{{anyVariable}}" 

Problem polega na tym, że zawsze pojawia się błąd jak najszybciej dodać wyraz do atrybutu ng-modelu w moim szablonu:

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) 

kod używany:

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

nie mogłem znaleźć sposób, aby przekazać wyraz ng-model w szablonie dyrektywy.

następujące rozwiązanie tworzy model odosobniony w ramach dyrektywy i dyrektywy controller dynamicznie tworzy Nazwa obiektu w głównym modelu kontroler obiektu i zegarki wyizolowaną model przechodzić aktualizacje do głównego modelu

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

Wypróbuj wersję tego:

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