Angularjs 1.5ディレクティブ要素htmlを置き換えます

Question

$state.paramsに従って変更するダイナミックボタンを使用してng-repeatを作成したいので、それらをディレクティブでラップしました。

link:function(scope,element,attrs) { 
$rootScope.$watch('params.source',function() { 
    var link = scope.link; 
    var name = scope.name; 
    var href = $state.href('home',{source:link}); 
    if($state.params.source.indexOf(scope.link) == -1) { 
     var template = '<a href="'+href+'" class="btn 
      btn-default">'+name+'</a>'; 
    } 
    else template = '<a href="'+href+'" class="btn 
     btn-default">'+name+' what!?</a>'; 
    el = $compile(template)(scope); 
    element.replaceWith(el);      
}); 
} 

しかし、私はelementを置き換えることができますどのようparamsの最初の変更後、elementを忘れてしまったとCannot read property 'replaceChild' of null

と答え？

編集：私は、私はNG-ショーやNG-場合

感謝を使用することはできません理由です、最終製品に他のsowmething用素子全体を交換する必要があります！

Answer 1

htmlでng-hideまたはng-showを使用する方がよい場合があります。

<div ng-repeat="yourArray as item"> 
    <a href="{{item.href}}" class="btn 
    btn-default">{{item.name}} <section ng-show="conditionToShow">what!?</section></a>'; 

</div> 

これは少し洗練されたソリューションで、時計を追加する必要がありません。時計は高価で、可能な限り時計を避けるべきです。

編集：

<div ng-repeat="yourArray as item"> 
    <div class="singleBtn" ng-show="conditionToShow" > 
     <a href="{{item.href}}" class="btn btn-default">{{item.name}}</a> 
    </div> 
    <div class="multiBtn" ng-hide="conditionToShow"> 
     <a //rest of multi btn code 
    </div> 

</div> 

ため、角度は、これはあなただけの1つの条件に基づいて、これらの要素のプレゼンテーションを制御することができますngのショーとngの非表示のディレクティブの両方を提供するという事実の（つまり、あなた。 state.params）

trueの場合は1つのbtnだけ表示され、falseの場合は複数のボタンが表示されます。ロジックを逆にする必要がある場合は、ng-showとng-hideを切り替えてください。

今回はあなたの必要性をよく理解していただきたいと思います。