如何更改 Famo.us + Angular 中元素的 classList？

Question

I'm using Famo.us + Angular. 我可以通过这样做来检索 classSurface 列表：

$scope.findElement = function() {
    var elem = $famous.find("#colored-bg")[0].renderNode;  // Returns Surface
    console.log(elem.classList);  // RETURNS: ["purple-bg", "container-border", "box-shadow"]
};

您不能对 Famo.us 对象执行您通常可以对 DOM 上的任何其他对象执行的任何操作。例如，我认为我可以添加、删除或替换 classes，类似于：

document.getElementById('id').classList.add('class');
document.getElementById('id').classList.remove('class');

不过，添加和删除不存在。我可以 return class 列表，甚至列表中的单个项目（例如：仅第一个 class），但您不能更改它。有什么建议吗？

Answer 1

Tony Alves 在 Famo.us Slack Chat 中找到答案：

renderNode.setClasses(['white-bg']);

此信息是在 github docs 中找到的。所以整个函数看起来像这样：

$scope.findElement = function() {
    var elem = $famous.find("#colored-bg")[0].renderNode;
      console.log(elem);
      elem.setClasses(['white-bg']);
    console.log(elem.classList);  // RETURNS: ["white-bg"]
  };

setClasses 将接受一个字符串数组，并将其放入 Fa-Surface。

Answer 2

setClasses 方法接受一个数组，您可以使用以下方法设置 classes：

renderNode.setClasses(['white-bg', 'big-text']);

通过传递 class 名称使用 addClass 添加 class 使用：

renderNode.addClass('big-text');

通过传递 class 名称使用 removeClass 删除 class 使用：

renderNode.removeClass('big-text');

根据 class 名称是否存在将 add/remove 名称传递给 add/remove，从而使用 toggleClass：

renderNode.toggleClass('big-text');

如何更改 Famo.us + Angular 中元素的 classList？

How can you alter the classList of an element in Famo.us + Angular?

javascript

angularjs

famo.us

famous-angular