KnockoutJS - HTML 绑定



HTML 绑定使关联的 DOM 元素显示参数指定的 HTML。如果您想动态生成 HTML 标记,这很有用。

语法

html: <binding-value>

参数

  • KnockoutJS 将 DOM 元素的内容设置为提供的参数值。此功能在 JQuery 中也可用。如果 JQuery 不可用于实现此功能,则可以使用 KO。

  • 如果参数是可观察对象,则会在底层可观察对象更改时更新元素值。如果不使用可观察对象,则元素仅处理一次。

示例

我们来看看以下显示如何使用 html 绑定的示例。

<!DOCTYPE html>
   <head>
      <title>KnockoutJS Html binding</title>
      <script src = "https://ajax.aspnetcdn.com/ajax/knockout/knockout-3.1.0.js"
         type = "text/javascript"></script>
   </head>
   
   <body>
      <p><span data-bind="html: welcomeMessgae "></span></p>
      
      <script>
         function AppViewModel() {
            this.welcomeMessgae = ko.observable();
            this.welcomeMessgae ("<strong>Welcome to TutorialsPoint !!! For free online tutorials and courses click <a href = 'https://tutorialspoint.com/'>here</a>.</strong>");
         }
         
         ko.applyBindings(new AppViewModel());
      </script>
      
   </body>
</html>

结果

让我们执行以下步骤,了解上述代码如何运行 −

  • 将上述代码保存在html-bind.htm文件中。

  • 在浏览器中打开此 HTML 文件。

knockoutjs_declarative_bindings.htm
广告