Angularjs ngIf一次带角

我在Angular应用程序上使用标签，在用户需要时，使用ngIf延迟加载其中的指令和控件。问题是，如果用户在其中导航，我不想重新创建选项卡，考虑到这一点，我使用此技巧仅初始化选项卡一次，并在用户需要时显示它：

<button ng-click="tab.show=!tab.show">Toggle tab</div>

<div ng-if="tab.show || tab.initialized" ng-show="tab.show" ng-init="tab.initialized=true">
tab content
</div>

---

这可能是一个可行的解决方案：

myApp.directive("ngIfOnce", function () {
return {
    restrict: 'A',
    transclude: true,
    template: "<span ng-show='originalNgIf' ng-if='initialized' ng-transclude></span>",
    scope:{
        ngIfOnce: '='
    },
    link: function (scope, attr) {
        console.log( scope.ngIfOnce );            
        scope.$watch('ngIfOnce', function (newVal, oldVal) {
            console.log("changed" + newVal);
            scope.originalNgIf = newVal;
            if (scope.initialized === undefined && scope.originalNgIf === true) scope.initialized = true;

        });

     }
    }

myApp.directive（“ngIfOnce”，函数（）{
返回{
限制：“A”，
是的，
模板：“”，
范围：{
ngIfOnce:“=”
},
链接：功能（范围、属性）{
console.log（scope.ngIfOnce）；
范围：$watch（'ngIfOnce'，函数（newVal，oldVal）{
console.log（“已更改”+newVal）；
scope.originalNgIf=newVal；
如果（scope.initialized==undefined&&scope.originalNgIf==true）scope.initialized=true；
});
}
}

}))

---

它会屏蔽ngIfOnce内容并只执行一次ngIf，而ngShow会在每次作为属性传递的变量发生更改时执行

当然可能，您能分享一下您的尝试吗？它很有效！非常感谢。

myApp.directive("ngIfOnce", function () {
return {
    restrict: 'A',
    transclude: true,
    template: "<span ng-show='originalNgIf' ng-if='initialized' ng-transclude></span>",
    scope:{
        ngIfOnce: '='
    },
    link: function (scope, attr) {
        console.log( scope.ngIfOnce );            
        scope.$watch('ngIfOnce', function (newVal, oldVal) {
            console.log("changed" + newVal);
            scope.originalNgIf = newVal;
            if (scope.initialized === undefined && scope.originalNgIf === true) scope.initialized = true;

        });

     }
    }