Question

我有一个要求，必须在另一个网站上加载我的asp.net mvc / angularjs应用程序。所以我必须使用iframe。

 <iframe width="500" height="500" frameborder="0" scrolling="yes" src="http://localhost:12534/home"></iframe>

我的mvc网站上的示例页面（索引页面），如下所示：

    @{
       Layout = "~/Views/Shared/_Layout.cshtml";
    }

  //other page components

_Layout.cshtml

<body xmlns:ng="http://angularjs.org" id="ng-app" ng-cloak ng-controller="MainController">

    <header ng-class="{'no-shadow': page == 'home'}">
        <div class="container">
                            <ul class="nav navbar-nav navbar-right">
                            <li><a href="/HowItWorks">How It Works</a></li>
                        </ul>
                    </div>
        </div>
    </header>
</body>

我的问题：您是否可以告诉我如何在_layout页面仅在iframe内加载时隐藏标题部分？提前谢谢。

Answer 1

启动时

检查顶部窗口是否与当前窗口相同。如果顶部窗口来自另一个域，您可以将条件包装在try-catch子句中，因为如果您尝试访问window.top，它可能会抛出权限异常。

angular.module('app', [])
  .run(function($window, $rootScope) {
    $rootScope.isStandalone = $window == $window.top;
  });

HTML中的

在该条件下呈现标题

<div class="header ng-cloak" ng-if="isStandalone">[header]</div>

编辑：Plunker

在iframe

1 个答案: