ここにディレクティブ付きのボタンhtmlがありますprofile-unlink。profile-linkボタンをクリックした後に設定されたディレクティブを変更したい。それはAngularjsで可能でしょうか？
hamlのコード：
から：
%button.unlink{"ff-profile-unlink" => "true"} Unlink Facebook
に：
%button.unlink{"ff-profile-link" => "true"} Link Facebook
これを行う1つの方法は、それらをあなたのアプリケーションの状態に基づいて、2つのボタンと表示/非表示を持つことである使用ng-showしてng-hide。例：
%button.unlink{"ff-profile-unlink" => "true", "ng-show" => "linked_to_facebook", "ng-click" => "unlink_facebook"} Unlink Facebook
%button.unlink{"ff-profile-link" => "true", "ng-hide" => "linked_to_facebook", "ng-click"="link_facebook"} Link Facebook
その後
function SomeCtrl ($scope) {
$scope.link_facebook: function() { $scope.linked_to_facebook = true},
$scope.unlink_facebook: function() { $scope.linked_to_facebook = false},
}
別の方法は、CSSを使用して同じ結果を達成することです。ここでのロジックは、CSSを使用して、2つのボタンを持ち、毎回1つずつ非表示/表示することです。次に例を示します。
%div#links
%button.unlink{"ff-profile-unlink" => "true"} Unlink Facebook
%button.link{"ff-profile-link" => "true"} Link Facebook
そしてあなたのSASSで：
.linked_to_facebook {
.link { display: hidden}
.unlink {display: block}
}
.unlinked_from_facebook {
.link { display: block}
.unlink {display: hidden}
}
次に、とを使用addClassしremoveClassて、linked_to_facebookとunlinked_from_facebookを#linksdivに追加および削除します。
PS：上記のコードは改善できます。要点を示すだけです。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加