Javascript 如何在ng bind html中呈现角度变量的内容

Javascript 如何在ng bind html中呈现角度变量的内容,javascript,html,angularjs,ng-bind-html,ng-bind,Javascript,Html,Angularjs,Ng Bind Html,Ng Bind,我将从保存为varchar的数据库中获取一个HTML内容到前端javascript代码。它存储在一个名为vm.htmlContent的变量中,然后我想在我的网页中以HTML的形式再次显示这个字符串类型的HTML内容。我使用ngbindhtmlangular指令来执行此操作。存储在vm.htmlContent变量中的我的HTML内容是: <p> Date: </ p> <p> Time: </ p> <p> Venue: </ p&

我将从保存为varchar的数据库中获取一个HTML内容到前端javascript代码。它存储在一个名为
vm.htmlContent
的变量中,然后我想在我的网页中以HTML的形式再次显示这个字符串类型的HTML内容。我使用
ngbindhtml
angular指令来执行此操作。存储在
vm.htmlContent
变量中的我的HTML内容是:

<p> Date: </ p> <p> Time: </ p> <p> Venue: </ p>
我想在这个
ng绑定html中添加来自其他角度变量的日期、时间和地点。
日期、时间和地点变量是
vm.Date
vm.Time
vm.venue
,它们清楚地保存了相关数据有没有一种方法可以做到这一点而不必在
vm.htmlContent
variable
中插入字符串内容?

一些
。replace()
调用将是一种相当直接的方法,可以将这些变量放入其中:

vm.getReplacedContent = () => {
  return vm.htmlContent
    .replace('Date:', `Date: ${vm.date}`)
    .replace('Time:', `Time: ${vm.time}`)
    .replace('Venue:', `Venue: ${vm.venue}`)
}

<div ng-bind-html="vm.getReplacedContent()"></div>
vm.getReplacedContent=()=>{
返回vm.htmlContent
.replace('Date:','Date:${vm.Date}`)
.replace('Time:','Time:${vm.Time}`)
.replace('vention:','vention:${vm.venture}`)
}

虽然我对angular没有经验,我也不确定HTML是否会自动更新,这样做。如果它不更新,而不是使用函数,您可能必须使用另一个作用域变量和
$watch
vm.htmlContent变量来更新它。

使用replace尝试这种方法


angular.module(“myApp”,[]).controller(“myCtrl”,函数($scope,$sce){
$scope.date=“2018年7月3日”;
$scope.time=“下午1:00”;
$scope.vention=“美国”
$scope.mytext=“日期:时间:地点:”;
var replacedData=$scope.mytext.replace(“日期:”,“日期:”+$scope.Date)。replace(“时间:”,“时间:”+$scope.Time)。replace(“地点:”,“地点:”+$scope.vention);
$scope.myText=$sce.trustAsHtml(replacedData);
});


这里是否需要使用
htmlContent
变量?除非我遗漏了什么,否则您似乎可以使用“日期:”、“时间:”,等等来呈现其他三个变量。您自己的文本html内容从数据库中获取,并存储在
vm.htmlContent
变量中。我不能自己在javascript代码中键入文本。它必须来自数据库,为了存储它,我使用了
vm.htmlContent
变量。这就是Ite的用法,和我使用angular时提供的想法完全相同
Date:
Time:
Venue:
vm.getReplacedContent = () => {
  return vm.htmlContent
    .replace('Date:', `Date: ${vm.date}`)
    .replace('Time:', `Time: ${vm.time}`)
    .replace('Venue:', `Venue: ${vm.venue}`)
}

<div ng-bind-html="vm.getReplacedContent()"></div>