angularjs - Angularjs动态html字符串编译，其中包含指令

Question

我一直在尝试使用递归指令进行动态 html 字符串解析，该指令有效，但双向绑定似乎不起作用。这里需要一点帮助。下面是 plunker： http ://plnkr.co/edit/ovz2RJDmnHPgLUqUaH7M 这里是代码：

 var model = angular.module('modelApp', ['ui.bootstrap']);

model.controller('modalCtrl', ['$scope', '$window',
  function($scope, $window) {
    var modalctrl = this;
    modalctrl.form = {};

    $scope.showMeModalValues = function(){
      console.log(modalctrl.form);
    };
  }
]);

model.directive('contentInput', ['$compile',
  function($compile) {
    return {
      require: '^ngController',
      restrict: 'EA',
      link: function(scope, element, attrs, ctrl) {
        element.html('<input type="text" ng-model="ctrl.form.' + attrs.name + '" />');
        $compile(element.contents())(scope);
      }
    };
  }
]);

model.directive('dynamicInput', ['$compile', '$sce',
  function($compile, $sce) {
    return {
      templateUrl: 'myContent.html',
      require: '^ngController',
      restrict: 'EA',
      link: function(scope, element, attrs, ctrl) {
        var html = '<content-input name=' + attrs.name + '></content-input>';
        scope.html = $sce.trustAsHtml(html);
      }
    };
  }
]);

model.directive('reCompile', ['$compile',
  function($compile){
    return {
      require: '^ngController',
      restrict: 'EA',
      link: function(scope, element, attrs, ctrl){
        scope.$watch(attrs.reCompile , function(value){
          element.html(value);
          $compile(element.contents())(scope);
        });
      }
    };
  }]);

Answer 1

我发现问题了！！使用 ctrl 分配 scope.ctrl 解决了不使用工作解决方案更新 modalctrl.form Plunker 的问题：http: //plnkr.co/edit/ovz2RJDmnHPgLUqUaH7M

model.directive('dynamicInput', ['$compile', '$sce',
  function($compile, $sce) {
    return {
      templateUrl: 'myContent.html',
      require: '^ngController',
      restrict: 'EA',
      link: function(scope, element, attrs, ctrl) {
        scope.ctrl = ctrl;
        var html = '<content-input name=' + attrs.name + '></content-input>';
        scope.html = $sce.trustAsHtml(html);
      }
    };
  }
]);