Question

我这里有一个带有指令profile-unlink的按钮html。我想在单击按钮后更改设置为profile-link的指令。在角度js中这是可能的吗？

haml中的代码：

自：

%button.unlink{"ff-profile-unlink" => "true"} Unlink Facebook

要：

%button.unlink{"ff-profile-link" => "true"} Link Facebook

Answer 1

第一条评论是正确的，只需制作一个可以做两件事的函数。

%button.unlink{"ff-profile-linked-setter" => "true"}

%button.unlink{"ff-profile-linked-setter" => "false"}

Answer 2

执行此操作的一种方法是使用ng-show和ng-hide，使用两个按钮并根据您的应用程序状态显示/隐藏它们。 Foer例子：

%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隐藏/显示一个。这是一个例子：

%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到#links div。

P.S：上面的代码可以改进。这只是为了说明这一点。

单击按钮时更改角度指令

2 个答案: