在AngularJS中，有什么最好的方式来有条件地应用属性呢？

16 浏览
0 Comments

在AngularJS中，有什么最好的方式来有条件地应用属性呢？

我需要能够根据作用域中的布尔变量向元素添加例如\"contenteditable\"之类的属性。

示例用法：

{{content.title}}

 

如果$scope.editMode设置为true，那么会将contenteditable=true添加到元素中。

是否有一种类似ng-class的属性行为的简单实现方式？如果没有，我正在考虑编写一个指令并分享。

编辑：我可以看到我的提议的attrs指令和ng-bind-attrs之间似乎有一些相似之处，但它在1.0.0.rc3中被删除了，为什么？

admin 更改状态以发布 2023年5月22日
0

2 答案

0 Comments

你可以使用ng-attr为属性加前缀，以便对Angular表达式进行计算。 当表达式的结果为undefined时，这将从属性中删除值。

Hello World

当值为false时，将产生以下结果：

Hello World

因此，不要使用false，因为它将产生单词“false”作为值。

Hello World

当在指令中使用此技巧时，如果指令的属性缺少值，则这些属性将为false。

例如，上述示例将为false。

function post($scope, $el, $attr) {
      var url = $attr['href'] || false;
      alert(url === false);
}

0
0 Comments

我正在使用以下方法在无法使用ng-class时（例如在样式SVG时）有条件地设置类属性：

ng-attr-class="{{someBoolean && 'class-when-true' || 'class-when-false' }}"

同样的方法也适用于其他属性类型。

（我认为你需要使用最新版本的不稳定的Angular才能使用ng-attr-，我目前使用的是1.1.4）

0