ng-包括如何保留已包含模板的内容

时间:2016-05-02 11:46:18

标签: javascript angularjs

首先 代码

<div ng-repeat="item in tabs" ng-if="tabIndex == item.name" ng-include="item.view"></div>

我有 json of tabs

$scope.tabs = [
            {
                "name" : "Item1",
                "display" : "<span class='fa fa-cubes'></span> Localhost",
                "view" : "views/_item.html",
                "active" : 0
            }{
                "name" : "Item1",
                "display" : "<span class='fa fa-cubes'></span> Localhost",
                "view" : "views/_item.html",
                "active" : 0
            }

        ];

重复了tabs.view,这就是ng-repeat运行ng-include时调用同一链接的原因。这对我来说没问题。并且它会对模板进行一次调用,这对我来说也很完美。

现在问题 这是 _item.html页面

<textarea>value</textarea>

两个标签调用同一页面,运行时显示textarea,内容为&#39; value&#39;。但是当我在任何一个标签中编辑内容并切换到其他标签并返回到同一标签时,我发现textarea内容被重置为值。

如何避免? 我不想为此创建一个特殊指令,如果有任何其他解决方案,请建议。

为了澄清这一点,我希望ng-include在模板中加载后不刷新模板

1 个答案:

答案 0 :(得分:1)

问题在于您使用 ng-if

指令ng-if使用$ animate服务,该服务对于从html到html的动画非常有用,无需controller.js调用。 使用ng-if的可能示例将基于选择单选按钮或复选框的文本框视图。 Example

我建议您使用$ scope变量来保留以前的值。并使用ng-show代替ng-if为变量item.view

提供动画

ng-if vs ng-show