zoukankan      html  css  js  c++  java
  • angularJs包含

     

    AngularJS 包含

    使用 AngularJS, 你可以使用 ng-include 指令来包含 HTML 内容:

    实例

    <body ng-app=""> <div ng-include="'runoob.htm'"></div> </body>

    尝试一下 »

    步骤如下:


    runoob.htm 文件代码:

    <h1>菜鸟教程</h1> <p>这是一个被包含的 HTML 页面,使用 ng-include 指令来实现!</p>

    包含 AngularJS 代码

    ng-include 指令除了可以包含 HTML 文件外,还可以包含 AngularJS 代码:

    sites.htm 文件代码:

    <table>
      <tr ng-repeat="x in names">
        <td>{{ x.Name }}</td>
        <td>{{ x.Url }}</td>
      </tr>
    </table>

    包含的文件 "sites.htm" 中有 AngularJS 代码,它将被正常执行:

    sites.htm 文件代码:

    <div ng-app="myApp" ng-controller="sitesCtrl">
       <div ng-include="'sites.htm'"></div>
    </div>
    <script>
      var app = angular.module('myApp', []);
      app.controller('sitesCtrl', function($scope, $http) {
         $http.get("sites.php").then(function (response) {
           $scope.names = response.data.records;
         });
      });
    </script>

    尝试一下 »

    跨域包含

    默认情况下, ng-include 指令不允许包含其他域名的文件。

    如果你需要包含其他域名的文件,你需要设置域名访问白名单:

    sites.htm 文件代码:

    <body ng-app="myApp">
      <div ng-include="'http://c.runoob.com/runoobtest/angular_include.php'">
      </div>
     
      <script>
        var app = angular.module('myApp', [])
        app.config(function($sceDelegateProvider) {
           $sceDelegateProvider.resourceUrlWhitelist([
             'http://c.runoob.com/runoobtest/**'
           ]);
        });
      </script>
    </body>

    尝试一下 »

    此外,你还需要设置服务端允许跨域访问,设置方法可参考:PHP Ajax 跨域问题最佳解决方案。

    angular_include.php 文件代码:

    <?php
      // 允许所有域名可以访问
      header('Access-Control-Allow-Origin:*');
       echo '<b style="color:red">我是跨域的内容</b>';
    ?>
  • 相关阅读:
    MT4 图表上设置字符
    MC- 交易并设置止损
    MC- 挂单STOP交易
    MC-设置 止盈
    MC 跨周期 画线
    美版MC 使用
    改变和恢复view的方向
    app被Rejected 的各种原因翻译。这个绝对有用。
    更改navigationController push和pop界面切换动画
    线程访问外部数据
  • 原文地址:https://www.cnblogs.com/nnf-888/p/8459279.html
Copyright © 2011-2022 走看看