Question

我有一个这样的场景，其中JS中使用html，而在JS中不使用html，如何在JS中将html称为模板。我想将其用作模板。我不想在javascript中构建html，而是希望在模板中这样做。

Cannot GET /app/[object%20Object]

Answer 1

将HTML放入

<script type="text/template">
  <div class="wrapper">
    <p class="name">Nicoleta</p>
  </div>
</script>

并使用DOMParser将其提取为模板。例如，

const html = new DOMParser().parseFromString(document.querySelector('[type="text/template"]').innerText, 'text/html')

html随您想要什么。

Answer 2

请尝试这样。

 <html>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular-sanitize.js"></script>
    <body>

    <div ng-app="myApp" ng-controller="myCtrl">

    <p ng-bind-html="myText"></p>

    </div>

    <script>
    var app = angular.module("myApp", ['ngSanitize']);
    app.controller("myCtrl", function($scope) {
        $scope.myText = "My name is: <h1>John Doe</h1>";
    if (value === ' ') {
     $scope.error= "My name is: <h1>code</h1>";
    } 
    else {
    $scope.error= "My name is: <h1>error code</h1>";
    }
    });
    </script>

    <p><b>Note:</b> This example includes the "angular-sanitize.js",
    which has functions for removing potentially dangerous tokens from 
    the HTML.</p>

    </body>
    </html>

如何创建html模板并在JS中使用

2 个答案: