zoukankan      html  css  js  c++  java
  • angularjs中使用ng-bind-html和ng-include

    下面这个例子,往div标签内添加html内容:

    <!doctype html>
    <html ng-app="myApp">
    <head>
      <meta charset="UTF-8">
      <title>demo</title>
      <script type="text/javascript" src="lib/angularjs/angular.min.js" charset="utf-8"></script>
      
    </head>
    <body ng-controller="ctrl">
        <div ng-bind-html="myText"></div>
    <script>
    var app = angular.module('myApp',[]);
    app.controller("ctrl",function($scope,$sce){
        $scope.myText = $sce.trustAsHtml("<b>粗体内容</b><br/><i>斜体内容</i>");
    });
    </script>
    </body>
    </html>

    注意在赋值时需要将html用$sce.trustAsHtml作一个处理,不然页面会报错,无法输出内容。

    下面是ng-include的使用示例,跟上面的例子差不多,只是把要添加的html内容放到一个文件中:

    <!doctype html>
    <html ng-app="myApp">
    <head>
      <meta charset="UTF-8">
      <title>demo</title>
      <script type="text/javascript" src="lib/angularjs/angular.min.js" charset="utf-8"></script>
      
    </head>
    <body ng-controller="ctrl">
        <div ng-include="'demo1_1.html'"></div>
    <script>
    var app = angular.module('myApp',[]);
    app.controller("ctrl",function($scope){});
    </script>
    </body>
    </html>

    demo1_1.html

    <b>粗体内容222</b><br/><i>斜体内容222</i>
  • 相关阅读:
    Scanner类
    BufferedReader类
    打印类
    管道流
    内存操作流
    转换流——OutputStreamWriter类与InputStreamReader类
    Java字节流与字符流基本操作
    RandomAccessFile类
    File类
    Timer类和TimerTask类
  • 原文地址:https://www.cnblogs.com/modou/p/5879781.html
Copyright © 2011-2022 走看看