Блог

Я хочу создавать динамически формы. Внутри моего контроллера я создаю строку

 var str = "<input type='text' value='"   $scope.selectedData.code   "' class='form-control' />";
$scope.htmlString = $sce.trustAsHtml(str);
  

и на моей html-странице

 <div ng-bind-html="htmlString"></div>
  

я получаю значение, но оно не является обязательным.
Я также пытаюсь с

 var str = "<input type='text' ng-model='"   $scope.selectedData.code   "' class='form-control' />";
$scope.htmlString = $sce.trustAsHtml(str);
  

также не работает. Кто-нибудь может знать, как это может работать?

HTML :

Добавьте директиву: compile-template

 <div ng-bind-html="htmlString" compile-template></div>
  

JS :

 angular.module('ngApp', ['ngSanitize'])
.controller('controller1', ['$scope','$sce', function($scope, $sce) {
    var str = "<input type='text' ng-model='"   $scope.selectedData.code   "' class='form-control' />";
    $scope.htmlString = $sce.trustAsHtml(str);
}])
.directive('compileTemplate', function($compile, $parse){
    return {
        link: function(scope, element, attr){
            var parsed = $parse(attr.ngBindHtml);
            function getStringValue() {
                return (parsed(scope) || '').toString();
            }

            // Recompile if the template changes
            scope.$watch(getStringValue, function() {
                $compile(element, null, -9999)(scope);  // The -9999 makes it skip directives so that we do not recompile ourselves
            });
        }
    }
});