Question

我正在使用angularJS和bootstrap。

我在ResetAndRegisterCommon.html

中有以下html代码

<div class="error"
     ng-show="resetRegisterForm.Email.$invalid&& resetRegisterForm.Email.$dirty">
    <span ng-show="resetRegisterForm.Email.$error">

        <div class="alert alert-warning">
            Warning! Please enter valid email address
        </div>
    </span>
</div>

我想在Mypage1.html和Mypage2.html中重用上面的代码

我在Mypage1.html和Mypage2.html中尝试了以下代码，但html标记在Mypage1.html和Mypage2.html中根本没有呈现。

<link rel="import" href="ResetAndRegisterCommon.html">

Answer 1

您需要JS才能访问导入文件的内容。实际上它真的很容易。

让我们为<link>提供一个ID，以便我们可以调用它。

<link rel="import" href="page.html" id="import">

现在我们使用JS来调用它

var doc = document.querySelector('#import').import;

现在我们从导入的文档中获取DOM

var error = doc.querySelector('.error');

然后我们克隆它并将其附加到当前页面

document.body.appendChild(error.CloneNode(true));

bootstrap重用html标签代码在不同的页面中

1 个答案: